Riad Benguella 12:55 pm on February 17, 2021
Tags: core-editor ( 331 ), editor ( 173 ), gutenberg ( 221 ), gutenberg-new

What’s new in Gutenberg 10.0? (17 February)

This is GutenbergGutenberg The Gutenberg project is the new Editor Interface for WordPress. The editor improves the process and experience of creating new content, making writing rich content much simpler. It uses ‘blocks’ to add richness rather than shortcodes, custom HTML etc. https://wordpress.org/gutenberg/ 10.0, which means it’s the 100th release of the Gutenberg pluginPlugin A plugin is a piece of software containing a group of functions that can be added to a WordPress website. They can extend functionality or add new features to your WordPress websites. WordPress plugins are written in the PHP programming language and integrate seamlessly with WordPress. These can be free in the WordPress.org Plugin Directory https://wordpress.org/plugins/ or can be cost-based plugin from a third-party, the 100th release of a journey that started more than 4 years ago when Matt announced the project on WordCampWordCamp WordCamps are casual, locally-organized conferences covering everything related to WordPress. They're one of the places where the WordPress community comes together to teach one another what they’ve learned throughout the year and share the joy. Learn more. US 2016. (It’s also almost to the mark the 4th anniversary of the initial commit to the Gutenberg repository.)

I’m not going to lie, it was not an easy journey. Shipping something that impactful is not easy and, going in, there was no reason to believe in success: WordPress had already tried to replace TinyMCE a couple of times already. What would be different this time around? Not much probably, so initially very few people actually joined the project.

Six months later came WordCamp Europe 2017 and the first release of the plugin. The editor was nowhere close to being usable but it “clicked” for some, and the reactions to the presentation were hopeful.

However, then quickly came pushback. With all the attention that the project received, it became difficult to discern constructive debate from mere opposition. We each come with our own context, and some people had a fixed idea about what they wanted for the project. Some wanted to just reuse an existing page builder, others wanted to revive the Fields APIAPI An API or Application Programming Interface is a software intermediary that allows programs to interact with each other and share data in limited, clearly defined ways. project, some wanted it to be front-end-first, others wanted it to just replace the content area of the classic editor, some wanted it to be in Vue.JSJS JavaScript, a web scripting language typically executed in the browser. Often used for advanced user interfaces and behaviors., others wanted no change at all. With a product used by 40% of the web, we need to find consensus, and when we make compromises it can be so difficult for those involved to avoid the feeling that their voice is being ignored.

We also made quite a few mistakes: stability of some releases wasn’t so great, performance suffered in others, a11yAccessibility Accessibility (commonly shortened to a11y) refers to the design of products, devices, services, or environments for people with disabilities. The concept of accessible design ensures both “direct access” (i.e. unassisted) and “indirect access” meaning compatibility with a person’s assistive technology (for example, computer screen readers). (https://en.wikipedia.org/wiki/Accessibility) as well… Nonetheless, we kept pushing forward, improving the editor and the project in all aspects until its first inclusion in WordPress 5.0, and we haven’t stopped since.

It’s a delight to see some people who had very strongly disagreed with the initial vision or approach to Gutenberg gradually come to enjoy using the editor and join the project to carry on its vision. Others might still not like it, some won’t ever use it. One thing is certain though, we’ll continue doing our best to push forward, improve what’s already shipped and ship new exciting features; we’ll continue making mistakes and hopefully continue learning from them.

Today marks the 100th release of Gutenberg. Nothing extraordinary, just a regular release: it improves on the existing features, fixes bugs, adds new features and experiments with new ideas.

What I personally retain is the people, the ones who were with us from the start, the ones who were with us but left, the ones who joined in our journey, everyone who helped along the way, everyone who provided feedback, everyone who got their hands dirty and everyone who tried to use this editor, extend it, and provide ideas.

Thank you all.

10.0 🤯

Features

Add basic pages blockBlock Block is the abstract term used to describe units of markup that, composed together, form the content or layout of a webpage using the WordPress editor. The idea combines concepts of what in the past may have achieved with shortcodes, custom HTML, and embed discovery into a single consistent API and user experience.. (28265)
Make the parent block selector visible and offset in the block toolbar. (28598) (28721)

Enhancements

Update the social empty state for dark themes. (28838)
Add the tagtag A directory in Subversion. WordPress uses tags to store a single snapshot of a version (3.6, 3.6.1, etc.), the common convention of tags in version control systems. (Not to be confused with post tags.) name selector to the advanced panel of the Group block. (28576)
Categories block: Display message instead of empty content. (28697)
Show block patterns in the inserter for non-root level insert position. (28459)
A11y: Improve the keyboard navigation in the block patterns inserter. (28520)
Allow transforming Paragraph blocks to Buttons block. (28508)
Better top toolbar arrow gap. (28832)
Update layout icon to use the new design language. (28651)
Update the buttons icons. (28583)

New APIs

wordpress/data: Graduate the __experimentalResolveSelect function to a stable status. (28544)
wordpress/compose: Add useMergeRef ReactReact React is a JavaScript library that makes it easy to reason about, construct, and maintain stateless and stateful user interfaces. https://reactjs.org/. hook. (27768)
Components: Allow extra props for RadioControl component. (28631)
Add JustifyToolbar component to @wordpress/block-editor. (28439)
wordpress/i18ni18n Internationalization, or the act of writing and preparing code to be fully translatable into other languages. Also see localization. Often written with a lowercase i so it is not confused with a lowercase L or the numeral 1. Often an acquired skill.: Add new APIs for React bindings. (28784) (28725)

Bug Fixes

Fix block insertion a11y string. (28871)
Fix npm 7 compatability. (28824)
RangeControl: Fix input / slider widths. (28816)
Fix post title icon color. (28727)
Fix most used blocks usage persistence. (28694)
Use consistent icon width for the block icon in the block inspector. (28666)
Fix for Latest Posts focus not selectable. (28660)
Fix issue where gallery block requests all attachments when empty. (28621)
Fix handling of custom unit theme setting. (28603)
Fix wrong space-between style in the Buttons block. (28485)
Calculate insertion usage for block variations properly. (28663)
Fix the default Buttons block radius, and size. (28514)
Fix the Cover block height. (28455)

Experiments

Site Editor:
- Fix empty content when creating a new template. (28882)
- Fix complementary area not opening. (28732)
- Fix inserter can’t be closed. (28590)
- Fix gray screen on refresh when editing pages and posts. (28413)
- Show single post template in posts templates in the navigation sidebarSidebar A sidebar in WordPress is referred to a widget-ready area used by WordPress themes to display information that is not a part of the main content. It is not always a vertical column on the side. It can be a horizontal rectangle below or above the content area, footer, header, or any where in the theme.. (28229)
- Allow searching pages, posts and categories in the navigation sidebar. (27280)
Full Site Editing Architecture:
- Iterate on the public API of WP_Theme_JSON_Resolver. (28855)
- Rename pageTemplates configuration to customTemplates in theme.jsonJSON JSON, or JavaScript Object Notation, is a minimal, readable format for structuring data. It is used primarily to transmit data between a server and web application, as an alternative to XML.. (28830)
- Move theme.json support check to class. (28788)
- Improve performance on file access of experimental-theme.json. (28786)
- Load page templates via theme.json abstractions. (28700)
Full Site Editing blocks:
- Post Featured ImageFeatured image A featured image is the main image used on your blog archive page and is pulled when the post or page is shared on social media. The image can be used to display in widget areas on your site or in a summary list of posts. block: Render nothing if featured image doesn’t exist. (28625)
- Add a description to the template part block. (28839)
- Move template part title field to the block inspector. (28835)
- Use display title for template part block type toolbar anchor. (28691)
- Allow the query block to work on singular pages when inheriting the global query. (28351)
- Query Pagination block: cleanup. (28831)
- Enqueue comment-reply script when post-comments-form block gets rendered. (28826)
Navigation Block:
- Fix transparent navigation block submenus. (28904)
- Polish social links when inside navigation. (28836), (28448).
- Add block variation matcher to display information from a found match. (28626)
- Add new Post Navigation Link block. (28602)
Navigation screen:
- Fix failing request for menu items. (28764)
- Design Iteration. (28675)
- Clear block selection in the navigation editor when clicking editor canvas. (28382)
Block-based widgets screen and customizerCustomizer Tool built into WordPress core that hooks into most modern themes. You can use it to preview and modify many of your site’s appearance settings.:
- Add experimental flag and enable widgets screen in customizer. (28618)
Global Styles:
- Use context when translating entries in theme.json. (28246)
REST APIREST API The REST API is an acronym for the RESTful Application Program Interface (API) that uses HTTP requests to GET, PUT, POST and DELETE data. It is how the front end of an application (think “phone app” or “website”) can communicate with the data store (think “database” or “file system”) https://developer.wordpress.org/rest-api/.:
- Add URLURL A specific web address of a website or web page on the Internet, such as a website’s URL www.wordpress.org Details endpoint to REST API to allow retrieval of info about a remote URL. (18042)
- Pattern Directory API: Return the block pattern value as content. (28799)
- Pattern Directory API: Add a keyword filterFilter Filters are one of the two types of Hooks https://codex.wordpress.org/Plugin_API/Hooks. They provide a way for functions to modify data of other functions. They are the counterpart to Actions. Unlike Actions, filters are meant to work in an isolated manner, and should never have side effects such as affecting global variables and output. parameter. (28794)
UIUI User interface Components:
- Group all experimental components in the ui folder. (28624)
- Fix types. (28571)
- Add VStack component. (28798)
- Add HStack component. (28707)
- Add Flex component. (28609)

Documentation

Theme.json Documentation: Clarify naming schema for CSSCSS Cascading Style Sheets. Custom Properties. (28639)
Update Versions in WordPress to include 5.6.1 & 5.7. (28641)
Typos and tweaks: (28667), (28657), (28655), (28898), (28894), (28762), (28877).

Code Quality

Improve ButtonBlockAppender styles. (28464)
Blocks: Move the logic for Template Part label to the block. (28828)
wordpress/block-directory package: Replace string store names. (28777)
wordpress/block-editor package: Replace string store names. (28775)
Site Editor: Replace coreCore Core is the set of software required to run WordPress. The Core Development Team builds WordPress./edit-site store name with store object. (28722), (28695)
Relax JSDoc validation for typed packages. (28729)
Change apt command to apt-get command. (28840)
Refactor Buttons block to use JustifyToolbar controls. (28768)
i18n hooksHooks In WordPress theme and development, hooks are functions that can be applied to an action or a Filter in WordPress. Actions are functions performed when a certain event occurs in WordPress. Filters allow you to modify certain functions. Arguments used to hook both filters and actions look the same.: Don’t use typeof to check value falsiness. (28733)
Components: Set a default for the ComboboxControl onFilterValueChange. (28492)

Tools

List all dependencies when checking licenses in NPM 7. (28909)
Allow blank GitHubGitHub GitHub is a website that offers online implementation of git repositories that can can easily be shared, copied and modified by other developers. Public repositories are free to host, private repositories require a paid subscription. GitHub introduced the concept of the ‘pull request’ where code changes done in branches by contributors can be reviewed and discussed before being merged be the repository owner. https://github.com/ issues again. (28866)
wp-env.json: Pin tt1-blocks dependency to v0.4.3. (28741)
Add eslint rule for preventing string literals in select/dispatch/useDispatch. (28726)
build-worker: Extract the functions that build CSS and JS. (28724)
Unit Tests Workflow: Enable for documentation-only PRs. (28696)
Fix end-to-end failures on ‘Front Page’ template. (28638)
Fix lint issues (proper number of spaces). (28629)
Fix legacy settings tests for custom spacing. (28628)
end-to-end tests: Handle upgrade screen. (28592)
Add eslint rules to guard against unexpected imports/exports. (28513)
Add a welcome comment to first time contributor PRs. (28118)
end-to-end Tests: Document Settings. (27715)
Updating composer packages for php8 compatibility. (28623)

Various

Adjust defaults for COMPONENT_SYSTEM_PHASE variable. (28772)
build-worker: Call callback with error when no task for extension. (28723)

Performance Benchmark

The following benchmark compares performance for a particularly sizeable post (~36,000 words, ~1,000 blocks) over the last releases. Such a large post isn’t representative of the average editing experience but is adequate for spotting variations in performance.

Version	Loading Time	KeyPress Event (typing)
Gutenberg 10.0	7.6 s	27.72 ms
Gutenberg 9.9	8.0 s	30.25 ms
WordPress 5.6	5.65 s	33.2 ms

Kudos to all the contributors that helped with the release! 🙏

Thanks @mcsf for your help on the release post.

#core-editor, #editor, #gutenberg, #gutenberg-new

Robert Anderson 8:30 am on February 5, 2021
Tags: core-editor ( 331 ), editor ( 173 ), gutenberg ( 221 ), gutenberg-new

What’s new in Gutenberg 9.9? (5 February)

GutenbergGutenberg The Gutenberg project is the new Editor Interface for WordPress. The editor improves the process and experience of creating new content, making writing rich content much simpler. It uses ‘blocks’ to add richness rather than shortcodes, custom HTML etc. https://wordpress.org/gutenberg/ 9.9 is out now! Get those bytes into your website while they’re hot. This is the 99th(!!) release of the Gutenberg pluginPlugin A plugin is a piece of software containing a group of functions that can be added to a WordPress website. They can extend functionality or add new features to your WordPress websites. WordPress plugins are written in the PHP programming language and integrate seamlessly with WordPress. These can be free in the WordPress.org Plugin Directory https://wordpress.org/plugins/ or can be cost-based plugin from a third-party and will be the latest release that is bundled into WordPress 5.7.

The team has been hard at work implementing Full Site Editing, Global Styles, the Navigation blockBlock Block is the abstract term used to describe units of markup that, composed together, form the content or layout of a webpage using the WordPress editor. The idea combines concepts of what in the past may have achieved with shortcodes, custom HTML, and embed discovery into a single consistent API and user experience., the Widgets screen, and it shows. We also have plenty to offer for all you lovers of “bugbug A bug is an error or unexpected result. Performance improvements, code optimization, and are considered enhancements, not defects. After feature freeze, only bugs are dealt with, with regressions (adverse changes from the previous version) being the highest priority. fixes and enhancements”.

Yee-haw!

Custom icon and background colors in Social Icons

Does “Twitter blue” conflictconflict A conflict occurs when a patch changes code that was modified after the patch was created. These patches are considered stale, and will require a refresh of the changes before it can be applied, or the conflicts will need to be resolved. with your blogblog (versus network, site)’s aesthetics? You can now set a custom background color and/or icon color for all of the icons in a Social Icons block.

Preferences redesign

The Options modal is all grown up, has a brand new look, and is now called Preferences.

Text labels in the Block Toolbar

Prefer text to icons? Now if you turn on the “Display button labels” setting you’ll see text labels in the block toolbar.

9.9 🤠

Enhancements

Preferences modal redesign. (28329)
Add “Show block breadcrumbs” preference. (28133)
Show text labels instead of icons in block toolbars when option is set. (26135)
Social Icons: Add icon & background color options. (28084)
Image Block: Add border radius support. (27667)
Improve visual clarity of reusable blocks. (28318)
In-between inserter: Support both horizontal and vertical layouts. (27860)
Automatically turn Dark Mode on or off depending on theme’s background colour. (28233)
Show the Spacer block’s background on hover. (28129)
Switch to a more muted sibling inserter design. (28550)
Show tooltips on disabled elements. (27529)
Use system font for vanilla editor styles. (26822)
Only consider legal block types for the block list when transforming files to blocks. (26816)
Social Link: Add a class to the anchor element. (28494)
Image block: Add flow for converting to cover block from toolbar. (28414)
Cover block: Improve toolbar button labels. (28384)
Show reusable block parent border when child is selected. (28283)
Change the quick inserter border color. (27866)

New APIs

Add disabled support in ToggleControl and FormToggle. (28228)
Block APIAPI An API or Application Programming Interface is a software intermediary that allows programs to interact with each other and share data in limited, clearly defined ways.: Allow overriding the categoryCategory The 'category' taxonomy lets you group posts / content together that share a common bond. Categories are pre-defined and broad ranging. for block variations. (28482)
Add ability to filterFilter Filters are one of the two types of Hooks https://codex.wordpress.org/Plugin_API/Hooks. They provide a way for functions to modify data of other functions. They are the counterpart to Actions. Unlike Actions, filters are meant to work in an isolated manner, and should never have side effects such as affecting global variables and output. the return values of i18ni18n Internationalization, or the act of writing and preparing code to be fully translatable into other languages. Also see localization. Often written with a lowercase i so it is not confused with a lowercase L or the numeral 1. Often an acquired skill. functions. (27966)
(Experimental) Add thunk actions to replace rungen and controls. (27276)
(Experimental) Add __experimentalBatch(). (28210)
Component System: Add Grid Component. (28531)
Alow setting the crossOrigin attribute for the image transform’s image using a filter. (28255)
Add Truncate component. (28176)
Add buttonProps to PanelBody. (28147)
NavigationMenu: Add isSearchDebouncing prop. (28102)

Breaking Change

The format of the experimental-theme.json has been updated as per:

Split global block selector into root and defaults. (28533)
Make settings and style top-level keys. (28110)

Before:

{
  "global": {
    "settings": { ... },
    "styles": { ... }
  },
  "core/paragraph": {
    "settings": { ... },
    "styles": { ... }
  }
}

After:

{
  "settings": {
    "defaults": { ... },
    "root": { ... },
    "core/paragraph": { ... }
  },
  "styles": {
    "root": { ... },
    "core/paragraph": { ... }
  }
}

Bug Fixes

Fix sibling inserter color. (28579)
Fix issues causing the cover block to black out with a fixed background. (28565)
Fix site editor pins. (28547)
Resolve issue where insertion point is in incorrect position after changing block selection. (28542)
Components: Fix truncate export. (28527)
Fix regressionregression A software bug that breaks or degrades something that previously worked. Regressions are often treated as critical bugs or blockers. Recent regressions may be given higher priorities. A "3.6 regression" would be a bug in 3.6 that worked as intended in 3.5. with pinned plugin items on mobile. (28521, 28526)
Fix margins and width of 100%-width buttons. (28467)
Fix aborted rendering of non-nested reusable blocks. (28461)
Show insertion point after the last block in a container. (28418)
Reusable blocks: Prevent infinite recursion. (28405)
Fix block inserter automatic reorder. (28392)
Create Block: Extract the package name from the template value. (28383)
Fix handling of raw transforms that return multiple blocks. (28371)
Fix repeated backgrounds with transparent images. (28362)
Ensure inline image width popover doesn’t appear over media library modal. (28333)
Fix repeated backgrounds for cover srcset. (28310)
Fix typo in default template type descriptions. (28288)
Fix allowedFormats in RichText component. (28282)
Fix backwards compatibility issue with Inline Image format. (28223)
Inserter: Fix left padding on Block Pattern Inserter dropdown. (28150)
Fix toolbar keyboard navigation after pressing alt+F10. (28068)
Image Block: Update linkDestination when editing image link URLURL A specific web address of a website or web page on the Internet, such as a website’s URL www.wordpress.org. (27801)
Interface Skeleton: Limit the editor width to prevent some blocks to grow infinitely wide. (27695)
Button component: Add margin around the dash icon. (27461)
Fix issue where resetBlocks can result in an incorrect block selection. (21598)
Make custom spacing work with CoreCore Core is the set of software required to run WordPress. The Core Development Team builds WordPress.. (28548)
Block Validation: Allow unitless zero CSSCSS Cascading Style Sheets. lengths. (28501)
Add check for zero to the FocalPointPicker mediaRef which prevents a division by zero error. (28499)
Update HTMLHTML HyperText Markup Language. The semantic scripting language primarily used for outputting content in web browsers. Anchor description to refer to block instead of heading. (28367)
Warning component: Remove extra margin. (28316)
Block Directory: Silently avoid re-installing local blocks. (28304)
Inserter: Add description to content used in search. (28301)
Make empty paragraphs take up the same space on the frontend, as in the editor. (27995, 28268)
Fix potential data loss in Code Editor. (27717)
Adjust borders on gallery to prevent overlap. (27312)
Block Directory: Filter out disallowed blocks before showing available blocks. (25926)
Fix Cover block position. (28653)
Add minHeightUnit to latest core/cover deprecation. (28627)

Experiments

Full Site Editing
- Mark Post Comments Warning as block. (28511)
- Update theme attribute injection and removal. (28368)
- Template Part labels: Use title instead of slug. (28330)
- Parse the template before gets rendered. (28319)
- Use correct title property in snackbar after inserting Template Part. (28306)
- Fix templates export. (28292)
- Add template part missing state. (28277)
- Hide resize handle. (28272)
- Fix template part border states. (28241)
- Fix entity spotlight system. (28239)
- Post Title block: Add placeholder state. (28198)
- Template Parts: Fix loading issue. (28088)
- Add support for border configuration via theme.json. (28049)
- Update the layout of the title in the top bar while template editing. (27845)
- Expose group/ungroup buttons in site editor. (27611)
- Global Styles: Root element & border radius. (28320)
- Query block: Hide query block toolbar settings if query is inherited. (28290)
- Query block: Pagination with InnerBlocks. (28125)
- Add end-to-end tests for templates export. (28324)
- Add unit testunit test Code written to test a small piece of code or functionality within a larger application. Everything from themes to WordPress core have a series of unit tests. Also see regression. for site templates export. (28323)
- Add more tests for processing theme.json logic. (28202)
- Fix button outline in Navigation component. (28230)
- Fix template parts loading on frontend. (28752)
Navigation
- Fix menu item word wrap. (28516)
- Fix URL cutoff. (28515)
- Remove new navigation block features in the navigation editor. (28378)
- Fix save, undo and redo keyboard shortcuts in navigation editor. (28257)
- Fix the nav menu justify controls menu style. (28222)
- Polish the appender focus style. (28219)
- Fix navigation editor error. (28190)
- Try: Allow space between on menu items. (28169)
- Disable alignment for innerBlocks of Navigation block. (27365)
- Placeholder empty state. (26947)
- Open dropdown before focus on submenu item. (25322)
- Improve robustness of nav screen test. (28344)
Widgets
- Add widgetWidget A WordPress Widget is a small block that performs a specific function. You can add these widgets in sidebars also known as widget-ready areas on your web page. WordPress widgets were originally created to provide a simple and easy-to-use way of giving design and structure control of the WordPress theme to the user. id to blocks in the widgets screen. (28379)
- Fix categorization not showing in the global inserter. (28036)
- Fix end-to-end tests in widgets screen. (28375)
- Fix widgets screen end-to-end tests. (28264)
- Add some basic end-to-end tests for the widgets screen. (28160)
Pattern Directory: Create endpoints to proxy api.w.org/patterns. (26578)

Documentation

Add new page for i18n filters. (28553)
Update list of core block categories. (28483)
Fixed gramatical error in README. (28452)
Update the main readme with the current Gutenberg project phase. (28359)
Update links used in the developer portal. (28354)
Update links to reference HEAD instead of a specific branchbranch A directory in Subversion. WordPress uses branches to store the latest development code for each major release (3.9, 4.0, etc.). Branches are then updated with code for any minor releases of that branch. Sometimes, a major version of WordPress and its minor versions are collectively referred to as a "branch", such as "the 4.0 branch".. (28331)
Fix supports color gradient(s). (28328)
Add changelog for 28231. (28232)
Updated readme to reflect current implementation of the BlockCard component.. (28226)
Improve the intro page of the Block Editor Handbook. (28142)
Update documentation to use allowedFormats instead of the deprecated formattingControls. (25639)
Fix grammar in tutorial. (28447)
Update tree and raw-content links to reference HEAD instead of a specific branch. (28431)

Code Quality

Make sure toggleProps doesn’t replace important props on ToolbarGroup. (28401)
Fix bad var name in BlockParentSelector. (28325)
Fix file formatting for end-to-end test plugin. (28266)
Polish block menu and show only fills when available. (28486)
Rename some template part icons. (28458)
Add hook: UseNoRecursiveRenders. (28428)
Coding Standards: Fix PHPCS warnings. (28343)
Change the way RTL styles get enqueued. (28274)
Remove code no longer necessary. (28188)
Update/simplify case transforms. (28171)
Fix non static method WP_Block_Parser::Freeform called statically. (28017)
Refactor out CSS gradient from custom-gradient-bar. (27936)
Block Transform: Fix isMultiBlock property name. (28321)
Components: Update dependencies shared with G2 components. (28280)

Tools

Create Block: Add optional support for wp-env. (28234)
Dependencies: Upgrade TypeScript. (28586)
ESLint Plugin: Add missing eslint-plugin-import dependency. (28545)
wp-env: Add MySQLMySQL MySQL is a relational database management system. A database is a structured collection of data where content, configuration and other options are stored. https://www.mysql.com/. port info to start logs. (28441)
Run the load time indicator computation multiple times. (28419)
Don’t add default-custom-properties styles to all compiled files. (28395, 28462)
Fix typewriter test by using mouse.wheel and waiting for scroll. (28376)
Replace deprecated waitFor in end-to-end tests. (28360)
Add stale issue workflow for issues with need info requested. (28179)
Add script to remove node_modules of all packages. (28177)
Testing: Add CI workflow covering Node.js 12. (28139)
wp-env: Fix upload directory conflict in phpunit service. (28120)
Update issue templates. (27570)
Packages: Use canary flag for npm releases with next dist tagtag A directory in Subversion. WordPress uses tags to store a single snapshot of a version (3.6, 3.6.1, etc.), the common convention of tags in version control systems. (Not to be confused with post tags.). (28357)
Packages: Fully automate npm publishing with the latest and next tags. (28335)

Various

Components: Integrate G2 Text component. (28475)
Block Mover wording: ‘Move block position’ to ‘Change block position’. (28454)
Components: Upgrade FontSizePicker. (27594)

Performance Benchmark

Version	Loading Time	KeyPress Event (typing)
Gutenberg 9.9	5.083 s	27.05 ms
Gutenberg 9.8	4.633 s	29.64 ms
WordPress 5.6	4.718 s	27.11 ms

Kudos to all the contributors that helped with the release! 🙏

#core-editor, #editor, #gutenberg, #gutenberg-new

Bernhard Reiter 7:22 pm on January 20, 2021
Tags: core-editor ( 331 ), editor ( 173 ), gutenberg ( 221 ), gutenberg-new

What’s new in Gutenberg 9.8? (20 January)

As the GutenbergGutenberg The Gutenberg project is the new Editor Interface for WordPress. The editor improves the process and experience of creating new content, making writing rich content much simpler. It uses ‘blocks’ to add richness rather than shortcodes, custom HTML etc. https://wordpress.org/gutenberg/ team and community continue to forge ahead with implementing Full Site Editing and Global Styles, the latest installment of the Gutenberg pluginPlugin A plugin is a piece of software containing a group of functions that can be added to a WordPress website. They can extend functionality or add new features to your WordPress websites. WordPress plugins are written in the PHP programming language and integrate seamlessly with WordPress. These can be free in the WordPress.org Plugin Directory https://wordpress.org/plugins/ or can be cost-based plugin from a third-party (version 9.8) has been released today 🥳 As always, this release also includes many fixes and some nice new enhancements.

Semi-transparent Spacer BlockBlock Block is the abstract term used to describe units of markup that, composed together, form the content or layout of a webpage using the WordPress editor. The idea combines concepts of what in the past may have achieved with shortcodes, custom HTML, and embed discovery into a single consistent API and user experience.

The Spacer block, when selected, now has a semi-transparent background, rather than an (opaque) light grey one. This should make it easier to discern from any layer behind it (such as a Cover block or image), if that is of a very light color itself.

Block Switcher Shows variation icon

As a follow-up to an improvement to block variations that shipped with 9.7, the block switcher now displays the variation’s icon, rather than the block’s generic one.

Site Editor now iframed

The Site Editor now renders its content in an iframeiframe iFrame is an acronym for an inline frame. An iFrame is used inside a webpage to load another HTML document and render it. This HTML document may also contain JavaScript and/or CSS which is loaded at the time when iframe tag is parsed by the user’s browser.. There is a number of reasons for this, such as avoiding adminadmin (and super admin) CSSCSS Cascading Style Sheets. bleed, or allowing to simply use a theme stylesheet for a site without any adjustments. Once this approach proves stable, the team is planning to make the same change to the Post Editor.

FSE: No more auto-drafts

Full-Site Editing no longer creates auto-drafts for template and template part post objects. These auto-drafts were previously needed for block templates and template parts that were based directly on files from an FSE theme without any user modifications. However, they required complex management and sync logic that proved fragile. By removing them, the team hopes to stabilize a fundamental part of FSE.

9.8 😬

Enhancements

Use a semi transparent background for the spacer block when selected. (28103)
Display matching variation icon in Block Switcher. (27903)

New APIs

Create Block: Allow using locally installed packages with templates. (28105)
Create block: Add support for static assets. (28038)
Compose: Export useIsomorphicLayoutEffect and use it. (28023)

Bug Fixes

Reusable Blocks:
- Show an error message when a reusable block has gone missing. (28126)
- Fix dismiss notice after error. (28015)
Cover Block:
- Fix nested cover block bugbug A bug is an error or unexpected result. Performance improvements, code optimization, and are considered enhancements, not defects. After feature freeze, only bugs are dealt with, with regressions (adverse changes from the previous version) being the highest priority.. (28114)
- Fix invalidinvalid A resolution on the bug tracker (and generally common in software development, sometimes also notabug) that indicates the ticket is not a bug, is a support request, or is generally invalid. cover block transforms. (28087)
- Fix cover regressionregression A software bug that breaks or degrades something that previously worked. Regressions are often treated as critical bugs or blockers. Recent regressions may be given higher priorities. A "3.6 regression" would be a bug in 3.6 that worked as intended in 3.5.. (28287)
- Fix Cover focal point picker. (28350)
- Fix matrix alignment issue. (28361)
Fix block error when transforming blocks with Link Popover opened. (28136)
Fix PHPPHP The web scripting language in which WordPress is primarily architected. WordPress requires PHP 5.6.20 or higher Notice in navigation-link. (28134)
Prevent link paste in RichText components in Button and Navigation blocks. (28130)
Fix floating date status inferred for posts where the status has been edited. (28127)
BlockSwitcher: Fix crash due to null reference. (28122)
Verse: Fix line-wrap rendering on front-end of site. (28109)
FocalPointPicker: Fix rendering and dragging experience. (28096)
Block Directory: Fix “missing” block when the block can be installed from the directory. (28030)
Fix locked template not updating when inner blocks template prop changes. (28007)
Fix editor crash when registering a block pattern without categories. (27970)
Fix the RTL editor styles and the theme styles option. (27947)
Don’t close the block inserter when clicking the scrollbar or an empty area. (27946)
Fix AlignmentMatrixControl focus issue. (27945)
Fix unexpected autosave for published posts. (27942)
Fix RadioGroup to support zero as a Radio value. (27906)
Update embed block transforms to permit multiple links to be pasted in a paragraph (#27551). (27746)
Change the week headerHeader The header of your site is typically the first thing people will experience. The masthead or header art located across the top of your page is part of the look and feel of your website. It can influence a visitor’s opinion about your content and you/ your organization’s brand. It may also look different on different screen sizes. and left button style to meet the date spacing. (27730)
Add aria labels to box control component inputs/button. (27727)
Use clientWidth when no width is available for cropper. (27687)
CoreCore Core is the set of software required to run WordPress. The Core Development Team builds WordPress. Data: Normalize _fields value for use in stableKey. (27526)
Fix appender margins again. (27392)

Performance

Components: Expose composite APIAPI An API or Application Programming Interface is a software intermediary that allows programs to interact with each other and share data in limited, clearly defined ways. from Reakit. (28085)
Improve Inserter block hover performance. (26348)

Experiments

Full Site Editing Framework:
- Load content in iframe. (25775)
- Avoid using auto-drafts for theme templates and template parts. (27910)
  - Delete unused options while upgrading the plugin. (28164)
  - Fix _wp_file_based term deletion in migrationMigration Moving the code, database and media files for a website site from one server to another. Most typically done when changing hosting companies.. (28300)
- Fix the border radius in the site editor. (27986)
theme.jsonJSON JSON, or JavaScript Object Notation, is a minimal, readable format for structuring data. It is used primarily to transmit data between a server and web application, as an alternative to XML.:
- Add border radius to the theme styles schema. (27791)
- Add theme.json i18ni18n Internationalization, or the act of writing and preparing code to be fully translatable into other languages. Also see localization. Often written with a lowercase i so it is not confused with a lowercase L or the numeral 1. Often an acquired skill. mechanism and JSON file specifying which theme.json paths are translatable. (27380)
- Add: Save time theme.json escaping. (28061)
Group Block: Add border radius. (27665)
Hide the theme without comments.php deprecation message. (28128)
Fix navigation editor. (28080)
Widgets: Temporary fix for saving widgets. (28078)
Decouple query from edit site. (27972)
Only enable the template mode for viewable post types. (27948)
Box control units: Ensure custom units are preserved. (27800)
Navigation Block: Use draft status when user creates a post and don’t render unpublished posts in menus. (27207)

Documentation

Docs: Improve README file for @wordpress/create-block. (28052)
Create Block: Update the demo included in the README file. (28037)
Docs: Switch heading to Quick Start for consistency. (28019)
Docs: A wether, as it turns out, is a castrated ram. (28008)
Update Quickstart guide for the Development Environment documentation. (28005)
Update copyright year to 2021 in license.md. (27951)
Block API: Add more inline comments. (20257)
Changelog: Group entries for 9.8.0-rc.1. (28332)

Code Quality

Remove effects test file and remove unused refx dependency. (28162)
Annotations: Replace store name string with exposed store definition. (28156)
Edit Widgets: Replace store name string with exposed store definition. (28044)
Interface: Replace store name string with exposed store definition. (28041)
Upgrade Reakit to version 1.3.4. (28013)
Fix PHPCS warning: Undefined variable $i. (27955)
Consolidate block editor initializations. (27954)
Fix create-block PHP template files according to WordPress standards. (27949)
block-directory: Simplify the LOAD_ASSETS flow by making it an async function. (25956)

Tools

Workflows (i.e. GitHubGitHub GitHub is a website that offers online implementation of git repositories that can can easily be shared, copied and modified by other developers. Public repositories are free to host, private repositories require a paid subscription. GitHub introduced the concept of the ‘pull request’ where code changes done in branches by contributors can be reviewed and discussed before being merged be the repository owner. https://github.com/ Actions):
- Create Release Draft when tagging version. (27488)
- Add action to upload release to SVNSVN Subversion, the popular version control system (VCS) by the Apache project, used by WordPress to manage changes to its codebase. repo. (27591)
- Compare Performance upon Release. (28046)
- Build Plugin Workflow: Bump node version to 14. (28048)
End-to-end tests:
- FSE: Fix intermittent errors in multi entity editing test. (28107)
- Fix randomly failing end-to-end test. (28073)
- Upgrade puppeteer to 5.5.0. (28055)
- Performance tests: Fix. (28026)
Scripts:
- Align default engines for check-engines with the package. (28143)
- Add support for static assets in build commands. (28043)
- Make it possible to transpile .jsx files with build command. (28002)
- ESLint minor version upgrade to 7.17.0. (27965)
- Upgrade Jest to the new major version (26.x). (27956)
- Use wordpress/stylelint-config in wordpress/scripts. (27810)
Linting:
- ESLint Plugin: Enable import rules used in Gutenberg. (27387)
- Add no-unsafe-wp-apis to recommended configuration. (27327)
- Remove /wordpress from test/linting ignore paths. (20270)
- Update changelog for stylelint-config. (28074)
Testing: Prevent a direct usage of Reakit. (28095)
Update the minimum Node.js version to 12. (27934)
wp-env: Ensure the environment is used with the logs command. (27907)
Packages: Fully automate npm publishing with the latest and next tags (28335)
Upgrade webpack to version 5. (26382)
Revert “Upgrade webpack to version 5”. (27974)

Various

Gutenpride Template:
- New Package to use with the tutorial. (27881)
- Create Block: Enhancements to Gutenpride tutorial template. (28215)
URLURL A specific web address of a website or web page on the Internet, such as a website’s URL www.wordpress.org: Remove redundant array coercion. (28072)
Visual editor: Remove focusable wrapper. (28058)
Readme: Increase tested Version up to WP 5.6. (28050)
Interface: Remove deprecated prop from InterfaceSkeleton. (28034)
List View: Reduce whitespace and always show nested blocks. (28029)
Making the sidebarSidebar A sidebar in WordPress is referred to a widget-ready area used by WordPress themes to display information that is not a part of the main content. It is not always a vertical column on the side. It can be a horizontal rectangle below or above the content area, footer, header, or any where in the theme. inspector’s tabs stick when scrolling. (28003)
Chore: Update Lerna dependency. (27990)
Try: Make focus width a CSS variable. (27968)
Add translationtranslation The process (or result) of changing text, words, and display formatting to support another language. Also see localization, internationalization. context to all block’s titles. (27933)
Add primary destructive button style. (27774)
Modifies the widgets dashboard link to point to the new widgets editor. (26880)
Use standard select element for small number of authors. (26426)
Add srcset for cover image. (25171)

Performance Benchmark

Version	Loading Time	KeyPress Event (typing)
Gutenberg 9.8	5.55s	29.05ms
Gutenberg 9.7	5.29s	26.32ms
WordPress 5.6	4.66s	28.57ms

Kudos to all the contributors that helped with the release! 🙏

#core-editor, #editor, #gutenberg, #gutenberg-new

Riad Benguella 9:35 am on January 7, 2021
Tags: core-editor ( 331 ), editor ( 173 ), gutenberg ( 221 ), gutenberg-new

What’s new in Gutenberg? (6 January)

First release of 2021 🎉. A number of contributors enjoyed some well earned time off but it didn’t stop them from shipping exciting features for the blockBlock Block is the abstract term used to describe units of markup that, composed together, form the content or layout of a webpage using the WordPress editor. The idea combines concepts of what in the past may have achieved with shortcodes, custom HTML, and embed discovery into a single consistent API and user experience. editor.

Block Patterns Drag and Drop

Similar to blocks drag and drop that shipped in the previous release, GutenbergGutenberg The Gutenberg project is the new Editor Interface for WordPress. The editor improves the process and experience of creating new content, making writing rich content much simpler. It uses ‘blocks’ to add richness rather than shortcodes, custom HTML etc. https://wordpress.org/gutenberg/ 9.7 allows user to drag block patterns from the inserter right into the desired position in the canvas.

Reusable blocks

The release also so an important change to how reusable blocks are shown and edited in the editor solving some of the old issues around block inspector, and block toolbars for the reusable blocks. Based on these changes, the UIUI User interface for reusable blocks is most likely going to see some iterations on the upcoming weeks.

Matching block variations

Block variations are a great APIAPI An API or Application Programming Interface is a software intermediary that allows programs to interact with each other and share data in limited, clearly defined ways. that can be used to build a generic block and ship several variations on top of it. That’s how the embed blocks or social link blocks are built. In Gutenberg 9.7, if you insert a block variation, the editor is going to match the block being used and show the “icon” and “description” of the said block variation in the different elements of the interface. (Block navigation, block inspector…)

9.7 😅

Features

Support drag and dropping block patterns from the inserter. (27927)

Enhancements

Improve the Reusable Blocks UI by relying on multi entity save flow. (27887) (27885)
Show the insertion point indicator bellow the inbetween inserter. (27842)
Add block transforms previews. (27861)
URLURL A specific web address of a website or web page on the Internet, such as a website’s URL www.wordpress.org: RemoveQueryArgs should remove the ? char after removing all args. (27812)
Deburr the input of the Post Author and Parent Page controls when filitering results. (26611)
Display block icon, description and name by matching block variations. (27469)
RSS Block: Add an explicit border-box CSSCSS Cascading Style Sheets. rule. (27767)

New APIs

Create block: Allow to list npm packages to be installed in the template. (27880)
wordpress/url: Add a maxLength argument to filterURLForDisplay. (27530)
Add new package @wordpress/stylelint config. (22777)

Bug Fixes

Show all taxonomies in Tag Cloud block. (27930)
HTMLHTML HyperText Markup Language. The semantic scripting language primarily used for outputting content in web browsers. Block: Fix editor styles. (27627)
Don’t ignore extra edits made in the server when saving posts. (27929)
Remove the animation of post publish button during autosaving. (27874)
Prevent the inserter from closing when switching the pattern categoryCategory The 'category' taxonomy lets you group posts / content together that share a common bond. Categories are pre-defined and broad ranging.. (27792)
LinkControl: Fix horizontal scrollbar within block toolbar. (27777)
Create Block: Fix support for external templates. (27776) (27784)
Fix text color dropdown not opening. (27596)

Experiments

Full Site Editing Framework:
- Add support for custom templates in FSE themes. (27778)
- Refactor the edit-site store to clarify the purpose of templateId and templatePartId. (27839)
Full Site Editing Blocks:
- Site Logo: Remove duplicate link. (27924)
- Post excerptExcerpt An excerpt is the description of the blog post or page that will by default show on the blog archive page, in search results (SERPs), and on social media. With an SEO plugin, the excerpt may also be in that plugin’s metabox. block: Fix incorrect quotes for the class attribute in the wrapper. (27895)
Global Styles: Add padding control to the Global Styles sidebarSidebar A sidebar in WordPress is referred to a widget-ready area used by WordPress themes to display information that is not a part of the main content. It is not always a vertical column on the side. It can be a horizontal rectangle below or above the content area, footer, header, or any where in the theme.. (27154)
Navigation block: Fix the text color for links in the navigation block. (26698)

Documentation

Improve documentation for withNotices HOC in components package. (27863)
Add ContrastChecker component readme. (25570)
Remove default style information from the documentation. (27811)
Storybook: Fix broken import statements for DateTime component. (27794)
Add additional information about lock inheritance. (27834)
Typos and tweaks: (27909), (27799)

Code Quality

Use a consistent way to check isRTL. (27838)
Update the minimum required WordPress version to 5.5. (27807)
Remove unused redux-optimist dependency. (27798)
Storybook: Perform cleanup in the Storybook setup. (27786) (27813)
Raw handling: Remove duplicate code. (27758)
Refactor BlockSwitcher as a functional component. (27674)
Rich Text: Replace store name string with exposed store definition. (27820)

Tools

Remove overrides for JSDoc rules downgraded to warnings. (27912) (27879)
PluginPlugin A plugin is a piece of software containing a group of functions that can be added to a WordPress website. They can extend functionality or add new features to your WordPress websites. WordPress plugins are written in the PHP programming language and integrate seamlessly with WordPress. These can be free in the WordPress.org Plugin Directory https://wordpress.org/plugins/ or can be cost-based plugin from a third-party release tool: Fix svn add/rm commands for release tool. (27886)
Add types to the wordpress/keycodes package. (19520)
end to end tests:
- Make end to end tests do not rely on font size picker classes. (27825)
- Remove expect.assertions count from multi-entity-saving tests. (27802) (27818)
- Testing: Remove axe verification executed after every test case. (26626)
- Improve font size end to end tests to work with input changes on blur. (27871)

Performance Benchmark

Version	Loading Time	KeyPress Event (typing)
Gutenberg 9.7	5.41s	31.1ms
Gutenberg 9.6	5.45s	28.8ms
WordPress 5.6	5.45s	30ms

Kudos for all the contributors that helped with the release. 👏

#core-editor, #editor, #gutenberg, #gutenberg-new

André Maneiro 4:07 pm on December 23, 2020
Tags: core-editor ( 331 ), editor ( 173 ), gutenberg-new

What’s new in Gutenberg? (23 December)

Dragging blocks from the inserter

From this release, blocks can be directly dragged from the inserter to the post canvas ― dragging patterns is not yet supported.

Vertical layout for buttons

The buttons blockBlock Block is the abstract term used to describe units of markup that, composed together, form the content or layout of a webpage using the WordPress editor. The idea combines concepts of what in the past may have achieved with shortcodes, custom HTML, and embed discovery into a single consistent API and user experience. gained the ability to use a vertical layout in addition to the default horizontal.

9.6.0 🇨🇱

Features

Allow dragging blocks from the inserter into the canvas. (27669)
Buttons: Add variations for vertical layout. (27297)

Enhancements

Buttons block: Change position of the link popover. (27408)

New APIs

Add a useFocusOnMount hook to the wordpress/compose package. (27574)
Add a useFocusReturn hook. (27572)
Add a useConstrainedTabbing hook. (27544)
Components: Introduce a isDisabled prop to the Disabled component. (26730)
Create block:
Use Block APIAPI An API or Application Programming Interface is a software intermediary that allows programs to interact with each other and share data in limited, clearly defined ways. version 2. (26098)
Fix for supporting external templates. (27784) (27776)

Bug Fixes

WidgetWidget A WordPress Widget is a small block that performs a specific function. You can add these widgets in sidebars also known as widget-ready areas on your web page. WordPress widgets were originally created to provide a simple and easy-to-use way of giving design and structure control of the WordPress theme to the user. screen: Fix block select on focus. (27755)
Embed block: Add htmlHTML HyperText Markup Language. The semantic scripting language primarily used for outputting content in web browsers. and reusable support back. (27733)
Add useCallbackRef to avoid calling the ref multiple times with the same node. (27710)
Correct getRedistributedColumnWidths and related tests. (27681)
Remove CSSCSS Cascading Style Sheets. Custom Property in code block. (27672)
Fix regressionregression A software bug that breaks or degrades something that previously worked. Regressions are often treated as critical bugs or blockers. Recent regressions may be given higher priorities. A "3.6 regression" would be a bug in 3.6 that worked as intended in 3.5. on code block for font-size property (27862)
Block crashes if font family is not found. (27654)
popover flickering on small screens. (27648)
Adding single use block from main inserter causes focus loss and menu to be stuck open. (27641)
Changelog for 9.5.2. (27638)
Uncaught error with a custom generic store without a unsubscribe function in useSelect. (27634)
Revert date changes from branchbranch A directory in Subversion. WordPress uses branches to store the latest development code for each major release (3.9, 4.0, etc.). Branches are then updated with code for any minor releases of that branch. Sometimes, a major version of WordPress and its minor versions are collectively referred to as a "branch", such as "the 4.0 branch". ‘replace-moment’. (27550)
useMediaQuery: Make it safe for SSR environments without window. (27542)
Fixes the width on the circle color picker popover. (27523)
ComboboxControl/FormTokenField: Fix iOSiOS The operating system used on iPhones and iPads. zooming for input. (27471)
Fallback to regular subscribe if the store doesn’t exist in useSelect. (27466)
Global Styles getPresetVariable uses a wrong variable; Remove GLOBAL_CONTEXT. (27450)
Popover: Fix issue with undefined getBoundingClientRect. (27445)
Try fixing combobox a11yAccessibility Accessibility (commonly shortened to a11y) refers to the design of products, devices, services, or environments for people with disabilities. The concept of accessible design ensures both “direct access” (i.e. unassisted) and “indirect access” meaning compatibility with a person’s assistive technology (for example, computer screen readers). (https://en.wikipedia.org/wiki/Accessibility) issues. (27431)
Support gradients with omitted stop positions in CustomGradientPicker. (27413)
Fix combobox suggestion list closure when clicking scrollbar. (27367)
Video Block: Let the video fill the container. (27328)
Media & Text “crop image to fill” to work with linked media. (27211)
Give editable fields in blocks better aria-labels. (26582)
Replace function should handle empty string callback return in the shortcodeShortcode A shortcode is a placeholder used within a WordPress post, page, or widget to insert a form or function generated by a plugin in a specific location on your site. parser. (16358)

Performance

Split coreCore Core is the set of software required to run WordPress. The Core Development Team builds WordPress. blocks assets loading. (25220)

Experiments

Add a useDialog hook and replace the duplicated PopoverWrapper. (27643)
Refactor withFocusOutside to hook. (27369)
FSE: Block Navigation: update Navigation block placeholder. (27018)
FSE: Block Query
- Add new post link to Query. (27732)
- Allow Query LoopLoop The Loop is PHP code used by WordPress to display posts. Using The Loop, WordPress processes each post to be displayed on the current page, and formats it according to how it matches specified criteria within The Loop tags. Any HTML or PHP code in the Loop will be processed on each post. https://codex.wordpress.org/The_Loop. only inside Query block. (27637)
- Adjust mobile margins for the Query block’s grid view. (27619)
- Query block: Allow inheriting the global query arguments. (27128)
FSE: Blocks
- Add comment-form block styles. (27673)
- Tag Cloud block: Adjust styles for the different block alignments. (27342)
Site Logo:
- Remove line height. (27623)
- Add a rounded block style. (27621)
FSE: Infrastructure
- Apply hover class in outline mode. (27714)
- Update documentation to show how a theme can have FSE automatically enabled. (27680)
- Make the inserter in the site editor behave as a popover. (27502)
- Add an outline mode and use it both Site Editor and Template mode. (27499)
- Load the block patterns in the site editor. (27497)
- Move the templates prePersist logic to core-data. (27464)
- Expand the multi-entity saving panel by default. (27437)
- Reveal block boundaries on hover in the Site Editor. (27271)
- Site Editor – add query args for current context. (27124)
- Full Site Editing: Introduce a template editing mode inside the post editor. (26355)
- Remove optimistic updates to solve the template revert issue (27797)
FSE: Style System
- Fix: Font Weight and Style don’t work independently on global styles. (27659)
- Add custom units in BoxControl. (27626)
- Remove Font style, weight, decoration, and transform presets. (27555)
- Make client preset metadata match server. (27453)
- Do not pass selectors and supports information to the client. (27449)
- Add border radius support. (25791)
- Update font-weight names. (27718)
- Update performance of global styles code (27779)

Documentation

Add missing dependency to code example. (27742)
Precise that element ref returned by the hooksHooks In WordPress theme and development, hooks are functions that can be applied to an action or a Filter in WordPress. Actions are functions performed when a certain event occurs in WordPress. Filters allow you to modify certain functions. Arguments used to hook both filters and actions look the same. that return a ref can change between function or object. (27610)
Add escaping functions to code examples. (27603)
Add missing wordpress/components/CHANGELOG.md entry. (27576)
Minor changes to release documentation for clarity. (27571)
Capitalize JavaScriptJavaScript JavaScript or JS is an object-oriented computer programming language commonly used to create interactive effects within web browsers. WordPress makes extensive use of JS for a better user experience. While PHP is executed on the server, JS executes within a user’s browser. https://www.javascript.com/. in accordance with the word mark. (27539)
Fix typo in attributes.md. (27440)
Try: Update readme screenshot. (27223)
Document the useBlockWrapper hook in the block registration documentation. (26592)
Add a document explaining the different block API versions. (26277)
Update the registration examples to use apiVersion 2. (26100)

Code Quality

Remove: Missed unused weights and style translationtranslation The process (or result) of changing text, words, and display formatting to support another language. Also see localization, internationalization. code. (27739)
useDialog: Remove mousedown propagation stopping. (27725)
Try: Simplify focus return. (27705)
Popover/Modal: Remove and deprecate IsolatedEventContainer. (27703)
Popover: Use focus outside hook. (27700)
refactor: Tooltip component from classical to functional with hooks. (27682)
Template-part padding: Use variables. (27679)
Scope image block style variations to only the image block. (27649)
Refactor the EditorProvider component and extract hooks. (27605)
Use store definition instead of string for notices packages. (27548)
Merge RootContainer with BlockList. (27531)
Block wrapper: Isolate functionality into smaller hooks. (27503)
Writing flow: Consider events only from DOM descendents. (27489)
Writing flow: Isolate multi select focus element. (27482)
Multi selection: Move hook to WritingFlow with other multi selection logic. (27479)
Insertion indicator: Render after last block if none is specified. (27472)
Rewrite selection clearer in Block editor. (27468)
Move block focus listener to block props hook. (27463)
Block editor: Refactor effect.js to controls. (27298)
Animate: Type getAnimateClassName. (27123)
Refactor image block’s image editing tools into separate components. (27089)
Drop zone provider: Option to avoid wrapper element. (27079)
Audit variables stylesheet. (26827)
group block padding: Use variables. (27676)

Tools

Release script: Set draft status, and only remove after uploading asset. (27713)
CI: Run date test timezone and localeLocale A locale is a combination of language and regional dialect. Usually locales correspond to countries, as is the case with Portuguese (Portugal) and Portuguese (Brazil). Other examples of locales include Canadian English and U.S. English. variations using bash script. (27600)
Upgrade Babel packages to 7.12.x. (27553)
CI: Run package/date unit tests in different timezones. (27552)
Avoid cancelling other end-to-end test jobs when one fails. (27541)
Add webpack 5 support to dependency-extraction-webpack-pluginPlugin A plugin is a piece of software containing a group of functions that can be added to a WordPress website. They can extend functionality or add new features to your WordPress websites. WordPress plugins are written in the PHP programming language and integrate seamlessly with WordPress. These can be free in the WordPress.org Plugin Directory https://wordpress.org/plugins/ or can be cost-based plugin from a third-party. (27533)
Add GitHubGitHub GitHub is a website that offers online implementation of git repositories that can can easily be shared, copied and modified by other developers. Public repositories are free to host, private repositories require a paid subscription. GitHub introduced the concept of the ‘pull request’ where code changes done in branches by contributors can be reviewed and discussed before being merged be the repository owner. https://github.com/ support document. (27524)
Stabilize adding blocks end to end test. (27493)
GitHub Actions: Use a build matrix for the end-to-end tests GH action. (27487)
Packages: Make it possible to select minimum version bump for publishing. (27459)
Upgrade wp-prettier to 2.2.1. (27441)
Testing: Make image size test more stable. (27439)
Packages: Improve the script that automates version bumps. (27436)
CI: Update bundle size workflow to use the latest version. (27435)
wp-env: Xdebug support. (27346)
Make zip-based URLURL A specific web address of a website or web page on the Internet, such as a website’s URL www.wordpress.org parsing more general. (27019)
Add inserter performance measures. (26634)

Various

Verse Block:
- Add support for custom padding. (27341)
- Add support for font family. (27332)
- Add support for font size. (27735)
- Update CSS for frontend and editor. (27734)
Popover: Use a11y hooks instead of HoCs. (27707)
Refactor focus on mount. (27699)
Search block: Use em values for padding. (27678)
Button: Is-busy state candybar animation fixed. (27592)
Preformatted block: Add support for font sizes. (27584)
Remove autoFocus prop from URLInput and from the inserter search form. (27578)
Package lock: Update ws. (27532)
Update block-patterns.md. (27520)
Update wp-env codeowners. (27491)
Update the backup icon to better align with WordPress icon package dna. (27465)
Update the rich text control titles to sentence case structure. (27447)
Search Block: Remove the button only option from the UIUI User interface. (27379)
Add icons for template parts. (27378)
Increase radio dimensions to match checkboxes. (27377)
Adjusts settings modal height to 90%. (27362)
Change the Labels of the Vertical Align options. (27356)
Add element selector to template-part block. (27101)
Add explicit dismiss button and on dismiss callback to snackbar. (26952)
Make social list block align right able on published page & preview. (26861)
Update media-text focalPoint conditional rendering. (25968)
Remove default icon from PluginBlockSettingsMenuItem. (21392)
Add example preview to video block. (20703)

Performance Benchmark

Version	Loading Time	KeyPress Event (typing)
Gutenberg 9.6	4.33s	27.82ms
Gutenberg 9.5	4.21s	23.04ms
WordPress 5.6	5.16s	23.46ms

Kudos to all the contributors that helped with the release!

#core-editor, #editor, #gutenberg-new

Nik Tsekouras 1:51 pm on December 2, 2020
Tags: core-editor ( 331 ), editor ( 173 ), gutenberg-new

What’s new in Gutenberg? (2 December)

Full Height Alignment

This control can be integrated in other blocks as well and you can set the blockBlock Block is the abstract term used to describe units of markup that, composed together, form the content or layout of a webpage using the WordPress editor. The idea combines concepts of what in the past may have achieved with shortcodes, custom HTML, and embed discovery into a single consistent API and user experience. to be displayed in full height. The Cover block is a lovely case to see it in action.

Font sizes support in Code block

You can now change the font size of Code block’s contents.

9.5.0 🇲🇪

Features

Full Height Alignment control: Implementation and Cover block integration. (26615)
Code block: Add support for font sizes. (27294)

Enhancements

Improve block patterns preview in the Inserter. (27204)
Enhance social links placeholder to look more like the end result. (26953)
Add labels to image zoom control. (24574)

New APIs

Data: Use store instance as param for select and dispatch. (26655)
Adds instance URLURL A specific web address of a website or web page on the Internet, such as a website’s URL www.wordpress.org to wp-env start. (27282)

Bug Fixes

Fix crash when null date passed to TimePicker. (27316)
Add backward compatibility support for lightBlockWrapper in getSaveElement. (27189)
Restore the gray background in Post Editor. (27188)
Font size picker bugbug A bug is an error or unexpected result. Performance improvements, code optimization, and are considered enhancements, not defects. After feature freeze, only bugs are dealt with, with regressions (adverse changes from the previous version) being the highest priority. that adds px units to empty string values. (27111)
Font size unit back-compatibility does not executes on post edit. (27106)
Drop zone: Fix infinite loopLoop The Loop is PHP code used by WordPress to display posts. Using The Loop, WordPress processes each post to be displayed on the current page, and formats it according to how it matches specified criteria within The Loop tags. Any HTML or PHP code in the Loop will be processed on each post. https://codex.wordpress.org/The_Loop. in some contexts. (27090)
Interface regions: Fix focus style (on click). (27074)
Fix Separator editor styles. (27071)
Fix custom spacing support. (27045)
Fix jest process hanging. (27008)
Fix combobox suggestion list closure when clicking scrollbar. (27367)
Constrain tabbing to the popover in media replace flow. (26939)
Fix RangeControl mark placement and cursor styles. (26745)
New authors dropdown breaks author selection for editors. (26554)
HooksHooks In WordPress theme and development, hooks are functions that can be applied to an action or a Filter in WordPress. Actions are functions performed when a certain event occurs in WordPress. Filters allow you to modify certain functions. Arguments used to hook both filters and actions look the same.: Use own instance’s doAction for built-in hooks. (26498)
Inserter: Show preview in search results. (27193)
Gallery block:
- Fix duplicate css class. (27311)
- Adds back in icon and title for gallery block. (27293)
Search block: Fix icon strokeWidth properties. (27308)
Image block:
- Fix the zoom slider width. (27285)
- Fix double paste from clipboard. (27199)
- Hide some controls on multi selection of Image blocks. (27105)
Columns: Align single half width column to left. (27142)

Performance

Minimize the calls in useSelect by subscribing to only the stores needed. (26724)
Update prefer lang constructs to functions. (27070)

Experiments

Full Site Editing Framework:
- Fix template resolution priorities. (27303)
- Update default templates. (26941)
- Add Support for Templates Default and Custom Titles and Descriptions (JSJS JavaScript, a web scripting language typically executed in the browser. Often used for advanced user interfaces and behaviors. side – 27038, PHPPHP The web scripting language in which WordPress is primarily architected. WordPress requires PHP 5.6.20 or higher side 27036)
- Add theme taxonomyTaxonomy A taxonomy is a way to group things together. In WordPress, some common taxonomies are category, link, tag, or post format. https://codex.wordpress.org/Taxonomies#Default_Taxonomies. to templates and template parts. (27016)
Full Site Editing Blocks:
- Make the post title block editable. (27240)
- Post Comment: Update placeholder. (27013)
- Enable Post Featured ImageFeatured image A featured image is the main image used on your blog archive page and is pulled when the post or page is shared on social media. The image can be used to display in widget areas on your site or in a summary list of posts. to be set and replaced. (27224)
- Add alignment controls to Post Featured Image block. (27076)
- Query block:
  - Add grid view. (27067)
  - Add Posts List variation. (26990)
  - New settings icon in block toolbar. (27057)
  - Fetch all available post types (#27049). (27056)
  - Update Query block’s icon. (27048)
  - Query and QueryLoop use useInnerBlocksProps. (27014)
Site Editor:
- Avoid throwing warnings if there are no terms for a template or template part. (27210)
- Replace adminbar customize link with site-editor in FSE themes. (27135)
- Update the new templates dropdown list. (27235)
- Remove .block-editor selector dependency. (27063)
- Remove unused FullscreenModeClose component. (26997)
- Navigation:
  - Fix item color and padding. (27096)
  - Hide empty menus. (27141)
  - Add isText prop to NavigationItem. (27003)
  - Handle the no search results state. (27160)
  - Add search to templates and template parts. (26665)
  - Hide navigation item if target menu is empty. (25746)
Global Styles:
- Sort Global Styles block panels by panel title. (27163)
- Font Appearance should be enabled globally. (27150)
- Restrict edition of theme colors by users. (27250)
- Update mechanism that resolves Global Styles data. (27237)
- Include px units on default font sizes defined on theme.jsonJSON JSON, or JavaScript Object Notation, is a minimal, readable format for structuring data. It is used primarily to transmit data between a server and web application, as an alternative to XML.. (27083)
- Update stylesheet generation at edit site. (27065)
- Add button to reset color palette. (26975)
- Abstract preset variable retrieving and setting. (26970)
- Update metadata and add support for padding. (27099)
Templates and Template Parts wp-adminadmin (and super admin) lists:
- Update the template parts admin list with new columns and views. (27156)
- Add the theme source to the templates wp-admin list. (27108)
- Extend the wp_template admin list with new views and columns. (27034)
Support registry inheritance with atomic stores. (27162)
Code block: Paste plain text. (27236)
Generalize the atom family concept as an atom selector concept instead. (27147)
Bugs:
- Query block: Fix dirtying post on load. (27323)
- Preserve ‘Your homepage displays’ settings when updating the ‘general’ settings. (27206)
- Make sure templates and parts queries filterFilter Filters are one of the two types of Hooks https://codex.wordpress.org/Plugin_API/Hooks. They provide a way for functions to modify data of other functions. They are the counterpart to Actions. Unlike Actions, filters are meant to work in an isolated manner, and should never have side effects such as affecting global variables and output. by tax_query. (27113)
- Fix Template Part Not Found message on Windows server. (26772)
- Respect filtered settings when they’re ported to theme.json format. (27010)
- Preset controls need the preset CSSCSS Cascading Style Sheets. variables in scope. (27119)
- Site Editor:
  - Show document title on small screens with nav sidebarSidebar A sidebar in WordPress is referred to a widget-ready area used by WordPress themes to display information that is not a part of the main content. It is not always a vertical column on the side. It can be a horizontal rectangle below or above the content area, footer, header, or any where in the theme. open. (27051)
  - Fix block toolbar positioning. (27266)
  - Fix app headerHeader The header of your site is typically the first thing people will experience. The masthead or header art located across the top of your page is part of the look and feel of your website. It can influence a visitor’s opinion about your content and you/ your organization’s brand. It may also look different on different screen sizes. on small-medium screens. (27310)

Documentation

Expand on the Deprecations documentation. (27286)
Publish MainDashboardButton documentation to handbook. (27317)
Update: Creating a block-based theme tutorial. (27257)
ESLint PluginPlugin A plugin is a piece of software containing a group of functions that can be added to a WordPress website. They can extend functionality or add new features to your WordPress websites. WordPress plugins are written in the PHP programming language and integrate seamlessly with WordPress. These can be free in the WordPress.org Plugin Directory https://wordpress.org/plugins/ or can be cost-based plugin from a third-party: Include a note about the minimum version required. (27203)
Docs: Update @wordpress/data README with APIAPI An API or Application Programming Interface is a software intermediary that allows programs to interact with each other and share data in limited, clearly defined ways. changes. (27180)
Data: Improve documentation for new API added around stores. (27061)
wp-env: Improve documentation for “run” command. (27053)
Code block: Update the documentation. (27333)
Add block toolbar component readme. (25245)
Add block patterns list component readme. (24983)
[Contributors docs] JS meetings were shifted to 15:00GMT. (27047)
Typos and tweaks: (27120, 27081, 27062, 27060, 27039, 27153)

Code Quality

Replace store name string with exposed store definition:
- Edit Navigation (27182, 27281)
- Blocks (27336)
- Reusable Blocks (27094)
- Block Directory (27178)
- Keyboard Shortcuts (27355)
Search block: Remove invalidinvalid A resolution on the bug tracker (and generally common in software development, sometimes also notabug) that indicates the ticket is not a bug, is a support request, or is generally invalid. prop which was causing a ReactReact React is a JavaScript library that makes it easy to reason about, construct, and maintain stateless and stateful user interfaces. https://reactjs.org/. warning. (27306)
Refactor click redirect to avoid trailing div. (27253)
Editor styles: Convert to hook. (27080)
Add: PHP util function equivalent to lodash set. (27077)
Interface: Remove regions wrapper div. (27066)
Refactor typing observer. (27043)
Visual editor: Remove 4 wrapper divs. (27035)
Insertion point: Avoid wrapper div. (26994)
Typewriter: Rewrite with hooks. (26986)
Deprecate the withGlobalEvents HoC. (26749)
Edit Post: Refactor effects to action generators. (27069)

Build Tooling

Add eslint rule to prohibit unsafe APIs. (27301)
Update package lock to fix CI failures. (27098, 27102)
GitHubGitHub GitHub is a website that offers online implementation of git repositories that can can easily be shared, copied and modified by other developers. Public repositories are free to host, private repositories require a paid subscription. GitHub introduced the concept of the ‘pull request’ where code changes done in branches by contributors can be reviewed and discussed before being merged be the repository owner. https://github.com/ Actions: Build Plugin zip, store as artifact on every PR. (26746)
Scripts: Unpin ignore-emit-webpack-plugin dependency. (26739)
Adds Support to wp-env for setting the PHP version. (25268)
Configure phpunit-watcher to improve devex. (27058)
Run phpunit even when phpcs fails. (27024)
Scripts: Auto format TypeScript files with format-js. (27138)
End 2 End Tests:
- Fix randomly failing end-to-end test. (27358)
- Fix multi entity editing test. (27347)
- Add end-to-end tests for image editing tools. (27262)

Various

Simplify CSS for the code block. (27314)
Update the block variation widths in the block placeholder. (27255)
Don’t split translatable strings in block templates. (27361)
Reduce margin on placeholder for media. (27252)
Interface package: Move MainDashboardButton slot. (27213)
Decrease scrim when in a modal overlay. (27054)
Replace ‘Remove from Reusable blocks’ with ‘Manage Reusable blocks’. (27026)
Mark AWAIT_PROMISE as unstable API. (26852)
Block Support: Separate opt in for font style and weight options. (26844)
Latest Posts: Don’t use target="_blank". (25730)

Performance Benchmark

Version	Loading Time	KeyPress Event (typing)
Gutenberg 9.5	5.3s	28.6ms
Gutenberg 9.4	5.4s	32.6ms
WordPress 5.5	5.9s	27.1ms

Kudos to all the contributors that helped with the release. 👏

#core-editor, #editor, #gutenberg-new

Riad Benguella 10:07 am on November 19, 2020
Tags: core-editor ( 331 ), editor ( 173 ), gutenberg ( 221 ), gutenberg-new

What’s new in Gutenberg? (18 November)

While the work on Full Site Editing and Global styles is continuing, GutenbergGutenberg The Gutenberg project is the new Editor Interface for WordPress. The editor improves the process and experience of creating new content, making writing rich content much simpler. It uses ‘blocks’ to add richness rather than shortcodes, custom HTML etc. https://wordpress.org/gutenberg/ 9.4.0 introduced some nice additions to existing blocks and APIs. Let’s take a look at some of them:

Button widths

Instead of relying on dynamic widths, you can set percentage widths for button blocks.

BlockBlock Block is the abstract term used to describe units of markup that, composed together, form the content or layout of a webpage using the WordPress editor. The idea combines concepts of what in the past may have achieved with shortcodes, custom HTML, and embed discovery into a single consistent API and user experience. Variations Transformations

Blocks can provide block variations. In Gutenberg, a variation switcher can be added to the block inspector for these blocks.

Social Icons size support

Users can change the size of the icons in the Social Icons block.

Font size support for the List block

9.4 🇸🇰

Features

Add Keyboard Input inline format. (26801)
Add Block variations transformations. (26687)
Add width selector for button block. (25999) (26781).
Add font size support to the List block. (26257)
Social Links: Add ability to change social icon sizes. (25921)

Enhancements

Unify the inserter search UIUI User interface. (26595)
Polish custom select menu styles. (26956)
Polish menu item styles. (26889) (26720) (25218) (26572)
Polish the link interface. (26551)
Code & Preformatted Blocks: Delete on backspace if empty. (26605)
File Block: Move the URLURL A specific web address of a website or web page on the Internet, such as a website’s URL www.wordpress.org button to the Block toolbar. (26602)
Allow adding a headerHeader The header of your site is typically the first thing people will experience. The masthead or header art located across the top of your page is part of the look and feel of your website. It can influence a visitor’s opinion about your content and you/ your organization’s brand. It may also look different on different screen sizes. by typing /h1, /h2 etc. (26597)
Polish ShortcodeShortcode A shortcode is a placeholder used within a WordPress post, page, or widget to insert a form or function generated by a plugin in a specific location on your site. block styling. (26456)
Polish Search block styling. (26446)
Use a wider canvas for themes that don’t provide a custom width. (26357)
Show reduced UI on hover. (26882)
Update Legacy WidgetWidget A WordPress Widget is a small block that performs a specific function. You can add these widgets in sidebars also known as widget-ready areas on your web page. WordPress widgets were originally created to provide a simple and easy-to-use way of giving design and structure control of the WordPress theme to the user. toolbar button font to match UI when displayed in Widget Screen. (26841)
Update token field icon. (26726)
Windows 10 high contrast mode improvements. (26567)

New APIs

Create block: Add support for external templates installed from npm. (23712)
Add optional icon to snackbar notices. (26907)
wordpress/env: Add support for custom WP_HOME port. (26507)
wordpress/lazy-import: Allow importing local paths. (23751)
Format library: Introduce useAnchorRef. (26782)

Bug Fixes

Fix block context injection hook after CoreCore Core is the set of software required to run WordPress. The Core Development Team builds WordPress. change in block rendering. (26998) (27011)
Fix Query block’s Toolbar popover width. (26992)
Fix IE11 interface bugs. (26944)
Improve arrow navigation between blocks. (26921)
Fix block alignments when theme styles are disabled. (26912) (26680) (26376)
Fix padding of text-only buttons mode. (26769)
Fix horizontal mover icon position. (26761)
Fix column width units. (26757)
FormTokenField input position when typing. (26741)
Fix applying colors to outlined buttons. (26707) (24626)
Render big font sizes properly in the font size picker. (26705)
Use currentColor in quote blocks to better support dark themes. (26684)
Fix “Browse All” in Quick Inserter for container blocks. (26443)
Fix responsive embeds in the widget screen. (26263)
Fix undefined index notice in Social Link Block. (25663)
Buttons block: Fix default alignment icon in toolbar to reflect the actual default alignment of buttons. (26910)
Block Support: Fix font size style when applying block support. (26762)
Do not invalidate the entity record cache during optimistic update in saveEntityRecord. (26627)
Provide a minimum of code wrapping for the code block. (26623)

Experiments

Full Site Editing Framework: Rework templates and template parts synchronization. (26650) (26383)
Full Site Editing Blocks:
- Post ExcerptExcerpt An excerpt is the description of the blog post or page that will by default show on the blog archive page, in search results (SERPs), and on social media. With an SEO plugin, the excerpt may also be in that plugin’s metabox. block: Allow editing of generated excerpts. (26637)
- Post Excerpt block: Add missing closing div tagtag A directory in Subversion. WordPress uses tags to store a single snapshot of a version (3.6, 3.6.1, etc.), the common convention of tags in version control systems. (Not to be confused with post tags.). (26806)
- Add wide and full alignment options to the post/site title blocks. (26601)
- Template Part block: Render preview as div. (26873)
- Post Taxonomies: Fix PHPPHP The web scripting language in which WordPress is primarily architected. WordPress requires PHP 5.6.20 or higher Fatal erroor for unregistered taxonomyTaxonomy A taxonomy is a way to group things together. In WordPress, some common taxonomies are category, link, tag, or post format. https://codex.wordpress.org/Taxonomies#Default_Taxonomies. (#26851). (26854)
- PostAuthor: Safeguard to wait for authors to load. (26776)
- Query block: Update the order of settings and filters in the sidebarSidebar A sidebar in WordPress is referred to a widget-ready area used by WordPress themes to display information that is not a part of the main content. It is not always a vertical column on the side. It can be a horizontal rectangle below or above the content area, footer, header, or any where in the theme.. (26647)
Site Editor:
- Fix responsiveness. (26021)
- Fix alignment of the new template button. (26934)
- Add default block widths styles. (26853)
- Refactor menu creation code. (26966)
- Only show auto-draft template parts corresponding to current theme. (26948)
- Polish the template navigation menuNavigation Menu A theme feature introduced with Version 3.0. WordPress includes an easy to use mechanism for giving various control options to get users to click from one place to another on a site.. (26933), (26930).
- Add navigation panel back button slot. (26846)
- Remove dashboard button focus on mount. (26845)
- Saving flow: Use template and template parts entities titles. (26708) (26653)
- Reorder template creation dropdown. (26610)
Global styles:
- Fallback to theme color pallete. (26783) (26786)
- Hide Block panels without content. (26609)
- Update styles to rely on CSSCSS Cascading Style Sheets. variables for colors and gradients. (26319)
- Fix Table block global styles selector. (26973)
- Hide the line height panel if disabled in theme.jsonJSON JSON, or JavaScript Object Notation, is a minimal, readable format for structuring data. It is used primarily to transmit data between a server and web application, as an alternative to XML. file. (26778)
- Cache generated styles. (25680)
- Add: Mechanism to detect if a block instance matches a global styles selector. (26945) (26991)
- Extract theme json processor. (26803)
- Add support for line height at the global level. (26767)
- Add preset classes generation on the client side. (26224)
Navigation block: Fix color support declaration. (26928)
Popover: Add sticky boundary element prop. (26728)
Block Support:
- Add font style and weight options with combined UI. (26444) (26868)
- Add text transform block support flag. (26060) (26059)
- Add Font Family picking mechanism. (24868), (26750), (26759).

Performance

Use 2-pass terser compression. (24821)
Memoize getEntityRecords to prevent infinite re-renders. (26447)
Resolve per-entity resolvers after receiving a list of records. (26575)

Documentation

Update theme.json documentation with new properties added. (26891)
Interface: Add deprecation logic for leftSidebar prop. (26826)
Document the block supports style properties. (26771) (26931) (26859)
Update testing documentation with info about ReactReact React is a JavaScript library that makes it easy to reason about, construct, and maintain stateless and stateful user interfaces. https://reactjs.org/. Testing Library. (23015)
Add documentation for AutosaveMonitor. (26663)
Typos and tweaks: (26797), (26796), (26795), (26794), (26793), (26792), (26791), (26790), (21607), (27017), (26919), (26863), (26857), (26618), (26029), (25349), (17878), (16090), (26799), (26765), (26654).

Code Quality

Use date-fns and date-fns-tz instead of moment. (25782) (27002)
is-shallow-equal: Convert to ESM. (26833)
Minor code refactoring in template part previews. (26949)
Drop zone: Rewrite with hooksHooks In WordPress theme and development, hooks are functions that can be applied to an action or a Filter in WordPress. Actions are functions performed when a certain event occurs in WordPress. Filters allow you to modify certain functions. Arguments used to hook both filters and actions look the same. and simplify. (26893)
PostTitle: Rewrite with hooks (+ avoid globals). (26820)
Avoid relying on a the global document. (26834) (26814) (26813) (26657)
Format library: Use hooks for all components. (26779)
Sandbox: Use hooks and avoid withGlobalEvents. (26742)
Draggable: Use hooks and prepare for iframeiframe iFrame is an acronym for an inline frame. An iFrame is used inside a webpage to load another HTML document and render it. This HTML document may also contain JavaScript and/or CSS which is loaded at the time when iframe tag is parsed by the user’s browser.. (26897)
PostLockedModal: Use hooks and avoid withGlobalEvents. (26743)
WpEmbedPreview: Use hooks and avoid withGlobalEvents. (26740)
FocusableIframe: Use hooks and avoid withGlobalEvents. (26737)
Navigation Component: Update styles to reference grid spacing helper. (26523)
Hooks: Type package. (26430)
Deprecated: Type package. (26429)
Movers: Small positioning refactor. (26353)
Use useAnimate for all Animate component usage. (26201)
Gallery block: Use APIAPI An API or Application Programming Interface is a software intermediary that allows programs to interact with each other and share data in limited, clearly defined ways. v2. (26145)
Gallery: Remove obsolete deprecation entry. (26736)
Cleanup: (24831), (23598), (27000).
Remove useMemo in Query inspector controls. (26658)

Build Tooling

Add eslint rule to warn against using globals for addEventListener. (26810)
Update workflows to use Node 14.x. (26835)
Add command to format PHP files. (26850)
Build Tooling: Rebuild stylesheets when imported styles are modified. (26649)
Fix GH actions “cancel” step. (27025)
Run assign fixed issues and first time contributor label tasks for PRs from forks. (26876)
Update .nvmrc to use latest LTS. (26855)
Update nodegit to 0.27.0 in wordpress/env. (26712)
Tests: Add fixture for Column deprecation. (26774)
Store screenshots of CI end-to-end failures as CI artifacts. (26664) (26957)
End 2 End Tests:
- Fix improper assertion in template-part.test. (26709)
- Fix RTL end-to-end tests. (26508)
- Add regresion end-to-end test for the empty reusable block causing WSODs issue. (26913)
- Add block drag and drop test. (26869) (26904)
- Add Delete on backspace from empty code/preformatted blocks test. (26972)
- Merge end-to-end test relying on order into one. (26883)
- Add template part conversion end-to-end tests. (26788)
- Make the allowed blocks test more stable. (26631)
- Add end-to-end test utils to install and activate themes. (23685)

Various

TextControl: Support forwarding refs. (26209)
Update gutenberg_is_fse_theme function to make it filterable. (27021)
Windows: Use wp-env instead of file location. (26671)
Site Editor: Rename left sidebar → secondary sidebar. (26517)
Add State locks for concurrency control to wordpress/core-data. (26389) (26661)
Avoid PHP warnings when Gutenberg pluginPlugin A plugin is a piece of software containing a group of functions that can be added to a WordPress website. They can extend functionality or add new features to your WordPress websites. WordPress plugins are written in the PHP programming language and integrate seamlessly with WordPress. These can be free in the WordPress.org Plugin Directory https://wordpress.org/plugins/ or can be cost-based plugin from a third-party folder isn’t writable. (17671)

Performance Benchmark

Version	Loading Time	KeyPress Event (typing)
Gutenberg 9.4	6.2s	26.6ms
Gutenberg 9.3	6.3s	23.7ms
WordPress 5.5	6.7s	22.1ms

Kudos for all the contributors that helped with the release. 👏

#core-editor, #editor, #gutenberg, #gutenberg-new

Riad Benguella 1:14 pm on November 4, 2020
Tags: core-editor ( 331 ), editor ( 173 ), gutenberg ( 221 ), gutenberg-new

What’s new in Gutenberg? (4 November)

This is the first GutenbergGutenberg The Gutenberg project is the new Editor Interface for WordPress. The editor improves the process and experience of creating new content, making writing rich content much simpler. It uses ‘blocks’ to add richness rather than shortcodes, custom HTML etc. https://wordpress.org/gutenberg/ release that is not going to be included entirely in WordPress 5.6. The important bug fixes were backported to WordPress 5.6 betaBeta A pre-release of software that is given out to a large group of users to trial under real conditions. Beta versions have gone through alpha testing in-house and are generally fairly close in look, feel and function to the final product; however, design changes often occur as part of the process. 2 and 3.

In addition to the stability work for WordPress 5.6, the contributors also focused on improvements to the Full-site editing flows. The FSE experiment will be automatically enabled if you activate a blockBlock Block is the abstract term used to describe units of markup that, composed together, form the content or layout of a webpage using the WordPress editor. The idea combines concepts of what in the past may have achieved with shortcodes, custom HTML, and embed discovery into a single consistent API and user experience.-based theme.

The site editor and its navigation panel saw a lot of improvements as well.

9.3 🇲🇾

Enhancements

Support for all units in Font Size presets. (26475)
Sort post formats alphabetically by translated name. (26305)
Ensure Alignment options are always rendered in the same order. (26269)
Buttons block: Overhaul alignment and justification controls. (23168)
a11yAccessibility Accessibility (commonly shortened to a11y) refers to the design of products, devices, services, or environments for people with disabilities. The concept of accessible design ensures both “direct access” (i.e. unassisted) and “indirect access” meaning compatibility with a person’s assistive technology (for example, computer screen readers). (https://en.wikipedia.org/wiki/Accessibility): Retain focus position when tabbing back to the block toolbar. (25760)
Dark mode UIUI User interface enhancements. (26483) (26510)
Social Links: Add Patreon, Telegram, and Tiktok icons. (26118)

Bug Fixes

Fix Visual regressionregression A software bug that breaks or degrades something that previously worked. Regressions are often treated as critical bugs or blockers. Recent regressions may be given higher priorities. A "3.6 regression" would be a bug in 3.6 that worked as intended in 3.5. on the color palette editor. (26614)
wordpress/scripts: Fix error in ignore-emit-webpack-pluginPlugin A plugin is a piece of software containing a group of functions that can be added to a WordPress website. They can extend functionality or add new features to your WordPress websites. WordPress plugins are written in the PHP programming language and integrate seamlessly with WordPress. These can be free in the WordPress.org Plugin Directory https://wordpress.org/plugins/ or can be cost-based plugin from a third-party. (26591)
Cover block: Restore default overlay background. (26569) (26625)
i18ni18n Internationalization, or the act of writing and preparing code to be fully translatable into other languages. Also see localization. Often written with a lowercase i so it is not confused with a lowercase L or the numeral 1. Often an acquired skill.: Fix incorrectly pluralized strings. (26565)
Limit the editor interface to max-width 100%. (26552)
Ensure editor footer remains at the bottom of the screen when navigating regions. (26533)
URLInput: Use debounce() instead of throttle(). (26529)
Heading Block: Fix double alignment controls in toolbar. (26492)
Fix Block preview vertical offset. (26487)
Reusable Blocks: Make the number retrieved from the APIAPI An API or Application Programming Interface is a software intermediary that allows programs to interact with each other and share data in limited, clearly defined ways. unlimited. (26486)
Fix editor error when an empty reusable block exists. (26484)
Latest Posts: Add missing classname. (26477)
Fix single column block display for smaller screens. (26438)
Turn off autocomplete for ComboboxControl components. (26427)
Fix parent post selector initial value and search. (26397)
Fix gallery block undo issue. (26377)
Fix spellings in the Getting Started guide. (26310)
Fix embed blocks rendering in widgetWidget A WordPress Widget is a small block that performs a specific function. You can add these widgets in sidebars also known as widget-ready areas on your web page. WordPress widgets were originally created to provide a simple and easy-to-use way of giving design and structure control of the WordPress theme to the user. areas. (26307)
Fix design of color/gradient controls. (26255)
Fix drop zone indicators for non blocks. (25986)
Fix left and right alignments for video embeds. (24847)
Next Page block: Center text properly. (26515)

New APIs

Allow text buttons in DropdownMenu. (26425)
Support custom viewportWidth in block previews (example). (26346)
Change updateSelection property to false for InnerBlocks. (26312)

Experiments

Full Site Editing :
- Disable customizerCustomizer Tool built into WordPress core that hooks into most modern themes. You can use it to preview and modify many of your site’s appearance settings. and widgets screens. (26594)
- Automatically enable FSE experiment. (26500)
- Remove the demo templates. (26419)
- Strip post ids from template part blocks on export. (26268)
- Allow themes to live in a subdirectory. (26391)
Introduce the layout prop to InnerBlocks. (26380)
Site Editor
- Add Dropdown to Create Generic Templates. (26284)
- Prevent inserter overscroll. (26432) (26583)
- Fix dirty template and template parts on template creation. (26560)
- Fix composite role warnings triggered by template part previews. (26406)
- Reduce the Amount of Data Passed Through the Components Tree. (26463)
- Add the option to convert a template part to regular blocks. (26488)
- Fix Invisible Template Previews in the SidebarSidebar A sidebar in WordPress is referred to a widget-ready area used by WordPress themes to display information that is not a part of the main content. It is not always a vertical column on the side. It can be a horizontal rectangle below or above the content area, footer, header, or any where in the theme.. (26424)
- Add convert to template part flow. (20445)
- Fix custom template part theme metaMeta Meta is a term that refers to the inside workings of a group. For us, this is the team that works on internal WordPress sites like WordCamp Central and Make WordPress.. (26587)
Query block:
- Add initial variations. (26378)
- Add sticky support. (26279)
Global Styles:
- Use block settings on the block panels. (26218)
- Fix: Font size picker regression on edit site global styles. (26603)
- Process settings only once. (26330)
Navigation Component:
- Add Support for RTL Languages. (26334)
- Styling revisionsRevisions The WordPress revisions system stores a record of each saved draft or published update. The revision system allows you to see what changes were made in each revision by dragging a slider (or using the Next/Previous buttons). The display indicates what has changed in each revision.. (26338)
- Fix focus behavior when opening the panel. (26296)
- Fix the height of the Navigation panel and make it scrollable. (26187)
- Search Control in Menu Titles. (25315)
Use a DropdownMenu for menu selection on the navigation screen. (25390)

Documentation

Update glossary to include more block-based terminology. (26478)
Update triagetriage The act of evaluating and sorting bug reports, in order to decide priority, severity, and other factors. documentation for clarity around closing issues and labels. (26480)
Update WordPress versions document to include 5.6. (26365)
Typos and tweaks: (26491), (26553), (26437), (26400), (26566).
Storybook: Fix broken BlockDraggable story. (26457) (26431)

Code Quality

Remove anonymous components from global styles sidebar. (26604)
Add types to components:
- Tip. (26173)
- BaseControl and VisuallyHidden. (26078)
Improve wordpress/I18n types. (26171)
Migrate to builtin data controls. (25993) (25949) (25773) (25990) (26509) (25772)
Chore: Ensure WordPress packages share the same hoisted dependencies. (26453)
Use CSSCSS Cascading Style Sheets.-in-JSJS JavaScript, a web scripting language typically executed in the browser. Often used for advanced user interfaces and behaviors. in wordpress/components:
- Spinner. (26433)
- Disabled. (25843)

Build Tooling

Components: Copy SCSS file from reactReact React is a JavaScript library that makes it easy to reason about, construct, and maintain stateless and stateful user interfaces. https://reactjs.org/.-dates to components package. (26534)
webpack: Replace legacy namedChunks/namedModules options with chunkIds/moduleIds. (26502)
Rewrite sideEffects flags to use only positive patterns. (26452)
Load the Twenty Twenty-one theme by default in Gutenberg’s local environement. (26414)
Build: Assign the library exports to window.wp rather than this.wp. (26272)
Move to Dart Sass compiler. (25628)
Fix composer test failures due to invalidinvalid A resolution on the bug tracker (and generally common in software development, sometimes also notabug) that indicates the ticket is not a bug, is a support request, or is generally invalid. lock. (26472)
Update node-watch to 0.7.0. (26403)
Release tool: Support multiple RCs. (25971)
jest-puppeteer-axe: Migrate to @axe-coreCore Core is the set of software required to run WordPress. The Core Development Team builds WordPress./puppeteer. (25659)
Improve End-to-End tests stability:
- Fix autosave end-to-end tests. (26416)
- Fix ‘Multi entity saving -> site editor’ end-to-end failures. (26371)
- Fix Twenty Twenty One related end-to-end test failures. (26341)
- Fix demo test by disabling the welcome dialog. (26314)
- Disable BlockPreviews from axe-core tests. (26527)
- Site editor: Fix end-to-end tests navigation panel. (26454)
- Consolidate sequential multi-entity-saving tests. (26373)
- Make the adding patterns test stable. (26345)

Various

Create Block: Update the list of categories to pick from. (26448)
Removes extra full stop from preferences. (26586)
wordpress/scripts: Configure all the tools to skip vendor folder. (26450)

Performance Benchmark

Version	Loading Time	KeyPress Event (typing)
Gutenberg 9.3	6.6s	27.16ms
Gutenberg 9.2	6.2s	26.62ms
WordPress 5.5	6.4s	27.53ms

Kudos for all the contributors that helped with the release. 👏

#core-editor, #editor, #gutenberg, #gutenberg-new

Isabel Brison 6:20 am on October 21, 2020
Tags: core-editor ( 331 ), editor ( 173 ), gutenberg ( 221 ), gutenberg-new

What’s new in Gutenberg? (21 October)

9.2 was the final release to make it into 5.6 BetaBeta A pre-release of software that is given out to a large group of users to trial under real conditions. Beta versions have gone through alpha testing in-house and are generally fairly close in look, feel and function to the final product; however, design changes often occur as part of the process.! Featured goodies in this release are:

Support for video subtitles 🎉

Subtitles dropdown on video blockBlock Block is the abstract term used to describe units of markup that, composed together, form the content or layout of a webpage using the WordPress editor. The idea combines concepts of what in the past may have achieved with shortcodes, custom HTML, and embed discovery into a single consistent API and user experience.. Props to @jorgefilipecosta for the screenshot.

Ability to transform multiple selected blocks into a Columns block:

Transforming three images into a three-column columns block.

And background patterns in Cover blocks!

Adding background patterns to a Cover block. props to @retrofox for the gif.

9.2 🇭🇺

Features

Add video tracks functionality. (25861)
Transform multiple selected blocks to Columns block. (25829)
Cover: Add repeated background option. (26001)

Enhancements

Add dropdown button to view templates in sidebarSidebar A sidebar in WordPress is referred to a widget-ready area used by WordPress themes to display information that is not a part of the main content. It is not always a vertical column on the side. It can be a horizontal rectangle below or above the content area, footer, header, or any where in the theme.. (26132)
Gallery block: Use image caption as fallback for alt text. (26082)
Table block: Use hooksHooks In WordPress theme and development, hooks are functions that can be applied to an action or a Filter in WordPress. Actions are functions performed when a certain event occurs in WordPress. Filters allow you to modify certain functions. Arguments used to hook both filters and actions look the same. + APIAPI An API or Application Programming Interface is a software intermediary that allows programs to interact with each other and share data in limited, clearly defined ways. v2. (26065)
Refactor document actions to handle template part titles. (26043)
Info panel layout improvement. (26017)
Remove non-coreCore Core is the set of software required to run WordPress. The Core Development Team builds WordPress. blocks from default editor content. (25844)
Add very basic template information dropdown. (25757)
Rename "Options" modal to "Preferences". (25683)
Add single column functionality to the Columns block. (24065)
Add more writing flow options: Reduced UIUI User interface, theme styles, spotlight. (22494)
Add option to make Post Featured ImageFeatured image A featured image is the main image used on your blog archive page and is pulled when the post or page is shared on social media. The image can be used to display in widget areas on your site or in a summary list of posts. a link. (25714)
Widgets Screen:
- Add legacy widgetWidget A WordPress Widget is a small block that performs a specific function. You can add these widgets in sidebars also known as widget-ready areas on your web page. WordPress widgets were originally created to provide a simple and easy-to-use way of giving design and structure control of the WordPress theme to the user. inspector card component. (26142)
- Show the legacy widget name in list view. (26138)
- Add unsaved changes warning to widgets screen. (26081)
- Display Widget Area’s name and description in the sidebar. (25943)
- Widgets editor: Add basic options for extensibility. (25758)
- Disallow multiple instances of reference widgets. (26148)
- Embed widget type. (26093)
- Add widget type endpoint. (26042)
- Make edit-widgets package public. (26016)
- Uncollapse widget area when block is dragged over. (25992)
- Add meaningful labels for the Widgets screen ARIA landmarks. (25867)
- Load custom block assets. (25826)
- Test for storing raw htmlHTML HyperText Markup Language. The semantic scripting language primarily used for outputting content in web browsers. in widgets. (24886)

New APIs

Make block supports server-side explicit. (26192)
New hook: UseDebounce for speak function. (25948)
Make the custom spacing theme support flag and block support API stable. (25788)
Mark the line height support flag as stable. (25769)
Mark the font size support flag as stable. (25695)
Mark the color support flag as stable. (25694)
Add a button to allow resetting the ComboboxControl value. (25692)
Block API: Light block edit/save symmetry. (25644)
Block API: Stabilize light block hook. (25642)
Inner blocks: Try hook approach. (25633)
API: Stabilize localAutosave() as autosave( { local: True } ). (20149)

Experiments

Query Block:
- Add Custom Post Types support in Query block. (25903)
- Set focus on Query block on insertion. (26267)
- Add loading message to Query block while fetching results. (26199)
- Add no results placeholder in Query block. (25984)
Site Editor:
- Clear the active menu state when closing the sidebar. (25957)
- Add missing localization to the templates sidebar. (25897)
- Mount both wp_template and wp_template_part EntityProviders to avoid remounting. (25870)
- Navigation templates. (25739)
- Update Navigation Panel Toggle UI. (25622)
- Move page switcher to navigation panel. (25620)
- Add template switcher to navigation panel. (25615)
- Pass editor features dynamically. (25795)

Bug Fixes

Fix for current_parsed_blocks value when block has inner blocks. (26291)
Fix updating clientId mapping. (26290)
Fix typo in wrapper attributes. (26282)
Fix: Keep the ‘Insert from URLURL A specific web address of a website or web page on the Internet, such as a website’s URL www.wordpress.org’ entered value on ImagePlaceholder. (26262)
Fix align order in heading block. (26260)
Widgets screen: Add a filterFilter Filters are one of the two types of Hooks https://codex.wordpress.org/Plugin_API/Hooks. They provide a way for functions to modify data of other functions. They are the counterpart to Actions. Unlike Actions, filters are meant to work in an isolated manner, and should never have side effects such as affecting global variables and output. function to registerCoreBlock. (26259)
Use ToolbarButtons instead of Buttons in the Legacy Widget block’s toolbar. (26258)
Widgets screen: Add "Browse all" option to the inserter. (26256)
Fix: Post schedule label showing wrong time if site and user timezones did not match. (26212)
Fix Site Title block’s heading levels appearance. (26202)
Writing flow: Fix in-between inserter for aligned blocks. (26197)
Fix Site Tagline block’s text alignment. (26191)
Fix separator and spacer blocks after api v2 refactoring. (26157)
Global Styles sidebar (blocks tab): Protect against not registered blocks. (26149)
Block templates: Recognize and convert old or derivative block types to their canonical form. (26147)
Fix editing Legacy Widgets doesn’t enable "Save" button. (26144)
Fix Cover width regressionregression A software bug that breaks or degrades something that previously worked. Regressions are often treated as critical bugs or blockers. Recent regressions may be given higher priorities. A "3.6 regression" would be a bug in 3.6 that worked as intended in 3.5.. (26143)
Fix tabbing in widgets not triggering auto-scrolling. (26139)
Cover block: Improve overlay opacity handling. (26133)
Fix icons type annotation. (26129)
FullscreenMode: Remove the is-fullscreen-mode CSSCSS Cascading Style Sheets. class from body on unmount. (26103)
Make sure Global Styles CPT includes a theme reference. (26061)
Restrict legacy widget block to only being a child of widget area. (26053)
Fix/wrong classes search block. (26052)
Fix drag and drop in empty widget area. (26051)
Fix unit tests by updating cover block fixtures. (26044)
Upgrade autoprefixer to fix fit-content in firefox. (26019)
Fix widget area title font. (26018)
Widgets screen: Fix WP Adminadmin (and super admin) Bar Widgets screen link. (26015)
Hide parent selector in widget area. (26011)
Document Actions: Fix unexpected label wrapping. (26004)
Fix template part theme identifier. (25995)
Show all widget areas on widget screen. (25977)
Fix block editor example in storybook. (25976)
Fix 9:16 aspect ratio styling. (25972)
Fix gallery caption not centered in the front-end issue. (25962)
Widgets screen: Add save keyboard shortcut. (25944)
Widgets screen: Remove default hover background in panel title. (25939)
Fix failing previews end-to-end test. (25938)
Fix input control drag and box control change. (25933)
Fix end-to-end tests related to template parts. (25923)
Fix insertion indicator margin. (25893)
Fix blue line indicator not showing at the end. (25849)
Fix incorrect attribute type specified in Search block. (25813)
Document Actions: Fix Block Editor Inserter Overlap with Document Titles. (25801)
Fix PHPPHP The web scripting language in which WordPress is primarily architected. WordPress requires PHP 5.6.20 or higher warning in widget utils REST controller. (25797)
Include edit-widgets php files in build. (25792)
Docs: Fix typo in GitGit Git is a free and open source distributed version control system designed to handle everything from small to very large projects with speed and efficiency. Git is easy to learn and has a tiny footprint with lightning fast performance. Most modern plugin and theme development is being done with this version control system. https://git-scm.com/. Workflow. (25779)
Widgets screen: Fix widget-area accessibilityAccessibility Accessibility (commonly shortened to a11y) refers to the design of products, devices, services, or environments for people with disabilities. The concept of accessible design ensures both “direct access” (i.e. unassisted) and “indirect access” meaning compatibility with a person’s assistive technology (for example, computer screen readers). (https://en.wikipedia.org/wiki/Accessibility). (25732)
Widgets screen: Fix insertion point in widget areas. (25727)
Document Settings: Fix document title hover and select animations. (25719)
Define text color for warning message component. (25713)
RichText: Remove native props for web. (25700)
Use h3 in the legacy widget title. (25690)
Navigation block: Use unbounded query when requesting top level pages. (25689)
Document Actions: Fix document title misalignment with an open nav sidebar. (25630)
Fix ReactReact React is a JavaScript library that makes it easy to reason about, construct, and maintain stateless and stateful user interfaces. https://reactjs.org/. error in wordpress/block-editor documentation usage example caused by applying args to setState call. (25492)
Cover Block: Show spinner while uploading. (25401)
Button block: Reduce chance of style conflicts. (24919)
Fix skipped shortcodeShortcode A shortcode is a placeholder used within a WordPress post, page, or widget to insert a form or function generated by a plugin in a specific location on your site. transforms in raw handling. (22840)
Media links: Fix linking for images inserted from URL. (22195)
Refactor reusable block edit component using hooks (and fix interactions with multiple instances of the same reusable block). (21427)

Performance

Paragraph: Avoid selector to improve performance. (26150)
Remove transition on block selection indicator. (25974)
Widgets screen: Preload request to /sidebars. (25726)

Documentation

Bring the block-based theme tutorial up to date. (25830)
Add more CI status badges to README. (26090)
Getting started: MAMP: Add tip to fix WP-CLIWP-CLI WP-CLI is the Command Line Interface for WordPress, used to do administrative and development tasks in a programmatic way. The project page is http://wp-cli.org/ https://make.wordpress.org/cli/. (26057)
Update colors readme with additional definitions. (25954)
Document isMultiBlock param for block transforms. (25952)
Update CI status badge in README. (25907)
Adds missing Curly brace. (25748)
Add documentation for colors component. (25567)
InspectorAdvancedControls: Add README.md. (25566)
Add documentation for useResizeCanvas. (25558)
Add/block navigation component readme. (24882)
Update Block Based Themes Documentation. (25710)

Code Quality

Pass all extra attributes down in get_block_wrapper_attributes. (26280)
Editor: Refactor PostFormatPanel to use React hooks. (26273)
BlockListBlock: Reduce passed props. (26251)
Editor: Refactor PostFormat to use React hooks. (26238)
Latest posts: Use hooks + API v2. (26122)
Latest comments: API v2. (26113)
Categories block: Use API v2. (26112)
Rename ReusableBlocksButtons to ReusableBlocksMenuItems. (26099)
Reusable block: Use API v2. (26091)
Gallery block: Use hooks. (26088)
Pullquote block: Use hooks + API v2. (26068)
Components: Start adding types progressively. (26066)
File block: Use hooks + API v2. (26063)
HTML block: Use hooks and API v2. (26055)
Update all blocks to API v2. (26054)
editor: Remove two unused registry controls. (26048)
Tweak styles of the document actions area. (26038)
Site Editor: Navigation panel replace hardcoded menu strings with constants. (26026)
Move left sidebar state to redux. (26003)
Refactor Categories to function component. (25806)
Classic block: Use hooks. (25737)
Remove animation from mover buttons. (25728)
Move widget-area to edit-widgets. (25673)
InnerBlocks: Add select dependencies. (25672)
Refactor Buttons block native edit component to use hooks. (25636)
Data: Build the basic data controls into every store. (25362)
Block Editor: Use optional chaining and nullish coalescing instead of Lodash.get. (23632)
Refactor Latest Comments block to use function component. (23557)
WordCount: Add types. (22077)

Security

PostCSS Plugins Preset: Update vulnerable dependency. (26140)

Breaking Change

Add separate widgets endpoint. (25958)

Various

Stabilize batching endpoint as v1. (26295)
Make batch opt-in more expressive. (26292)
Remove experimental sidebars endpoint shim. (26288)
Warn about using core/batch-processing store. (26287)
Remove WP_REST_Widget_Utils_Controller class. (26274)
Minor iterations to grouping for preferences panel. (26198)
Allow transform to Columns from a single block. (26185)
Use batch processing in edit-widgets package. (26164)
Minor updates to wordpress/edit-widgets for easier Core integration. (26136)
TextareaControl: Use CSS-in-JSJS JavaScript, a web scripting language typically executed in the browser. Often used for advanced user interfaces and behaviors.. (26131)
Add template lock attribute to column and group. (26128)
Reusable blocks support for widgets editor. (26097)
Bump @actions/core from 1.0.0 to 1.2.6. (26087)
First pass at using the new sidebars and widget endpoints. (26086)
Don’t rely on the exact count of registered widgets. (26085)
Try: Make class and style tests less brittle. (26079)
Components: Remove size prop from Dashicon. (26067)
Adjust media-text attributes to default stacked on mobile to true. (26041)
Support batch requests in data layer. (26024)
Fallback for dropcap when experimentalFeatures is not present. (25979)
Social Links: Update Placeholder experience when first inserting Social Links. (25941)
Check that get_current_screen is callable. (25935)
Social Link: Rename mail to email. (25924)
Autocomplete: Use hooks. (25922)
Skip broken template-part end-to-end test until it can be fixed. (25918)
Heading block: Add wide and full width options. (25917)
Social Links: Avoid conflictconflict A conflict occurs when a patch changes code that was modified after the patch was created. These patches are considered stale, and will require a refresh of the changes before it can be applied, or the conflicts will need to be resolved. with themes ul text-indent. (25916)
Site editor: Store navigation panel’s active menu state in the store. (25906)
Version bump to 9.1.1. (25904)
Export and document LinkControl’s building blocks. (25901)
Prevent networknetwork (versus site, blog) requests related to ephemeral posts in the widgets editor. (25899)
FSE Navigation Sidebar: Move navigation sidebar in DOM hierarchy. (25884)
Template part selection component – fix keyboard controls. (25881)
FSE Document actions – wrap with heading. (25874)
Extract wordpress/reusable-blocks from wordpress/editor. (25859)
Unify help description text styling. (25852)
BaseControl: Use CSS-in-JS. (25842)
Iterations on options modal. (25837)
BlockSelectionClearer: Use hooks. (25824)
Update pull request documentation URLs. (25815)
Add a dark mode to the post title. (25796)
Automatically generate required preset classes. (25768)
Ensure focus of input when InputControl spinner arrows are pressed. (25753)
External Link: Use CSS-in-JS. (25751)
Update improve backward compatibility for deprecated settings. (25738)
Initialize the state before rendering widgets editor. (25736)
Add color palette edit functionality to global styles. (25711)
UnitControl: Enable keyboard access (via tab) to unit select by default. (25704)
Add EditorStyles CSS to the widgets editor. (25699)
Display before_widget/after_widget when rendering WP_Widget_Block. (25693)
Remove the right margin for the right-most list items in the lastest posts block. (25688)
Update and move some Query filters. (25674)
Remove duplicate key from tsconfig.base.jsonJSON JSON, or JavaScript Object Notation, is a minimal, readable format for structuring data. It is used primarily to transmit data between a server and web application, as an alternative to XML.. (25664)
Try adding a ‘spotlight mode’ type effect when template part or child is selected. (25656)
Gallery: Add labels to img, figure and figcaption elements for accessibility. (25560)
Navigation component: Add back button click handler. (25556)
Hide the quick side inserter when the user is typing. (25548)
Add border to block "Edit as HTML" style. (25539)
Show PostFeaturedImage in editor. (25412)
Don’t allow duplicate selectors in styles. (25399)
Gallery: Add a margin declaration. (25291)
Page parent selector with ComboboxControl. (25267)
Add Align support to Separator block. (25147)
REST APIREST API The REST API is an acronym for the RESTful Application Program Interface (API) that uses HTTP requests to GET, PUT, POST and DELETE data. It is how the front end of an application (think “phone app” or “website”) can communicate with the data store (think “database” or “file system”) https://developer.wordpress.org/rest-api/.: Introduce batch controller. (25096)
Upgrade TypeScript to v4. (24892)
Use UnitControl instead of RangeControl for column width. (24711)
Add UI tests to unsupported block editor. (23729)
Add a description to the Site Title block. (23462)
Add storybook story for the FocusableIframe component. (22324)

Performance benchmark

Version	Loading Time	KeyPress Event (typing)
GutenbergGutenberg The Gutenberg project is the new Editor Interface for WordPress. The editor improves the process and experience of creating new content, making writing rich content much simpler. It uses ‘blocks’ to add richness rather than shortcodes, custom HTML etc. https://wordpress.org/gutenberg/ 9.2	5.1s	31.29ms
Gutenberg 9.1	5.3s	31.03ms

Kudos to all the contributors that helped with the release! 👏

#core-editor, #editor, #gutenberg, #gutenberg-new

Riad Benguella 8:54 am on October 1, 2020
Tags: core-editor ( 331 ), editor ( 173 ), gutenberg ( 221 ), gutenberg-new

What’s new in Gutenberg? (30 September)

GutenbergGutenberg The Gutenberg project is the new Editor Interface for WordPress. The editor improves the process and experience of creating new content, making writing rich content much simpler. It uses ‘blocks’ to add richness rather than shortcodes, custom HTML etc. https://wordpress.org/gutenberg/ 9.1 is out with almost 200 commits and 77 contributors! The main focuses for this release are iterations on the main projects for WordPress 5.6: the Widgets Screen and BlockBlock Block is the abstract term used to describe units of markup that, composed together, form the content or layout of a webpage using the WordPress editor. The idea combines concepts of what in the past may have achieved with shortcodes, custom HTML, and embed discovery into a single consistent API and user experience. APIAPI An API or Application Programming Interface is a software intermediary that allows programs to interact with each other and share data in limited, clearly defined ways..

Important progress has been made on the Global styles project with the possibility to use the theme.jsonJSON JSON, or JavaScript Object Notation, is a minimal, readable format for structuring data. It is used primarily to transmit data between a server and web application, as an alternative to XML. config file to control the block editor features and presets (color palette, font sizes, enabling/disabling features).

Also, the release includes some nice little improvements to the UIUI User interface and several blocks. Among these changes, the block patterns are now organized per categoryCategory The 'category' taxonomy lets you group posts / content together that share a common bond. Categories are pre-defined and broad ranging. in the block inserter to help navigate the list of available patterns.

9.1 🇲🇹

Features

Add “open in new tab” feature to Social Links Block. (25468)
Add Image Size control to the Media & Text block. (24795)

Enhancements

Inserter: Add block pattern category selection. (24954)
Reduce minimum height to 1px for the Spacer block. (25528)
Show the Fullscreen keyboard shortcut. (25395)
Improve the Audio block shortcodeShortcode A shortcode is a placeholder used within a WordPress post, page, or widget to insert a form or function generated by a plugin in a specific location on your site. transform to account for all sources. (25114)
Code block: Allow HTMLHTML HyperText Markup Language. The semantic scripting language primarily used for outputting content in web browsers. editing & rich text content. (24689)
Remove appender from unselected Buttons and Social Icons block. (25518)
Widgets Screen:
- Match the post editor inserter design. (25681)
- Register legacy widgets as block variations. (24905)
- Use the default block list appender for the widgetWidget A WordPress Widget is a small block that performs a specific function. You can add these widgets in sidebars also known as widget-ready areas on your web page. WordPress widgets were originally created to provide a simple and easy-to-use way of giving design and structure control of the WordPress theme to the user. areas. (25635)
- Add titles to Legacy Widgets. (25638)
Buttons block: Lighten editor DOM. (23222)
Copy: Reword block settings menu item labels. (22955)
Add a tooltip to the Drag & Drop handle. (25606) (25614)
A11yAccessibility Accessibility (commonly shortened to a11y) refers to the design of products, devices, services, or environments for people with disabilities. The concept of accessible design ensures both “direct access” (i.e. unassisted) and “indirect access” meaning compatibility with a person’s assistive technology (for example, computer screen readers). (https://en.wikipedia.org/wiki/Accessibility):
- Add aria-haspopup property to the BlockNavigation component. (25605)
- Add aria-haspopup property to the TableOfContents component. (25603)
- Add aria-haspopup to the ToolSelector. (25600)
- Add aria-haspopup to the MediaReplaceFlow button. (25597)
- Add aria-haspopup attribute to CustomGradientBar component. (25571)
- Add aria-haspopup to CircularOptionPicker component. (25564)
- Add aria-describedby to featured-image button. (24888)
Don’t show heading ancestor blocks in Document Outline. (25599)
Support the default link config for the Gallery and Image blocks (image_default_link_type). (25578) (25582)
Social Icons Block: Let icons wrap. (25334)

New APIs

Add new ComboboxControl. (25442)
Data Controls: Add new syncSelect control. (25336)
DateTimePicker: Add support for highlighting days. (22032)

Bug Fixes

Widgets Screen:
- Auto expand the last selected widget area when opening the inserter. (25669)
- Ensure all widgets are properly initialized when they’re added, do not unmount widgets once they’re mounted. (25645)
- Fix Legacy widget block previews and use iFrames. (25443) (14643)
- Report save errors. (25408)
- Fix global inserter. (24908)
Fix RangeControl direct entry in input field. (25609)
A11y:
- Fix the color contrast in the code editor. (25593)
- Fix Publish sidebarSidebar A sidebar in WordPress is referred to a widget-ready area used by WordPress themes to display information that is not a part of the main content. It is not always a vertical column on the side. It can be a horizontal rectangle below or above the content area, footer, header, or any where in the theme. Cancel button not usable through screen readers. (25441)
- Fix keyboard navigation on the Image block toolbar. (25127)
- More block: Use an actual placeholder for input text. (23836)
Fix nested container smart margins. (25527)
Fix add_filter instead of apply_filters. (25512)
Fix the WordPress embed preview in the editor. (25370)
Remove Embed block aspect ratio classes on url change. (25295)
Remove duplicate help item. (25283)
Fix Block Directory author average rating formating. (24732)
wordpress/api-fetch:
- Fix preloading middleware referencing stale data. (25550)
- Check nonce headerHeader The header of your site is typically the first thing people will experience. The masthead or header art located across the top of your page is part of the look and feel of your website. It can influence a visitor’s opinion about your content and you/ your organization’s brand. It may also look different on different screen sizes. value before skipping adding it. (25458)
Use esc_html instead of esc_attr in the Archives block. (25476)
Fix Canceling Drag and Drop using ESC key. (25317)
Cover block: Add explilcit box-sizing style. (25115)
Use a ComboboxControl for the post author selector to fix loading issues for sites with a big number of authors. (23237)

Performance

Avoid relying on DOM events to measure the loading time. (25288)

Experiments

Site Editor Screen:
- Fix wrong close label in the block inspector. (25424)
- Add basic template information to editor header. (25320)
- Fix the footer styling. (25152)
- Add a reset button to global styles sidebar. (25426)
- Show document subtext if template part child is selected. (25544)
- Add navigation panel. (25506)
- Fix site base URLURL A specific web address of a website or web page on the Internet, such as a website’s URL www.wordpress.org. (25409)
Post and Site Blocks:
- Add link option in PostTitle block. (25341) (25397)
- Register the Site Logo block using register_block_type_from_metadata. (25289)
Themes and global styles:
- Support defining colors and gradients config from theme.json. (25419)
- Support defining font sizes config from theme.json. (25516)
- Support custom units on theme.json. (25217)
- Add separate support keys for color and background color. (25314)
- Allow themes to enqueue custom CSSCSS Cascading Style Sheets. variables via theme.json. (25446) (25619)
- Refactor theme.json format. (25301) (25407)
- Update theme json documentation to account for latest changes. (25369)
Block API: Introduce useBlockWrapperProps hook to use light block DOM in the editor. (23034) (25679) (25554) (25515)
Navigation block and screen:
- Handle block menu items. (24846)
- Avoid auto-focusing Navigation block in Navigation screen. (25592)
- Change the block description. (25531) (25555)
- Allow Social Links within Navigation Block. (25357)
- Wrap navigation editing features with filters. (25329)
- Add move markers to list view. (25205)
Iterating on the Navigation Component (25608) (25495) (25572) (25540) (25520) (25507) (25367) (25364) (25340) (25327) (25281) (25280)

Documentation

Add a data format and flow architecture document. (25299)
wordpress/env: Add documentation for inspecting the docker compose file. (25666)
Add new block supports page to the handbook. (25647)
Block Directory: Add developer documentation. (25591)
Move custom-fields note to the ‘Register MetaMeta Meta is a term that refers to the inside workings of a group. For us, this is the team that works on internal WordPress sites like WordCamp Central and Make WordPress. Field’ documentation. (25584)
Add Block Editor Components documentation:
- Warning (25574)
- FontSizePicker (25568)
- UnitControl (25565)
- CopyHandler (25342)
- MultiSelection (25306)
- LineHeightControl (25303)
- BlockAlignmentToolbar (25212)
- AlignmentToolbar (25210)
- BlockFormatControls (25573)
Add Caveats section for MAMP. (25444)
Add FormTokenField story. (25439)
Improve documentation for the data registry control and selector creators. (25335)
Update git workflow documentation. (25164)
Refresh the Getting Started guide. (25090)
Update JavaScriptJavaScript JavaScript or JS is an object-oriented computer programming language commonly used to create interactive effects within web browsers. WordPress makes extensive use of JS for a better user experience. While PHP is executed on the server, JS executes within a user’s browser. https://www.javascript.com/. troubleshooting guide. (24105)
Enhance the Block Context documentation. (25272)
Typos: (25359) (25653)

Code Quality

Update the Dashicon component to rely on the font that ships with WordPress. (20003)
Add new $gray-200 SASS variable and use for skeleton borders. (25491)
Block Editor: Remove empty module focus-detector. (25561)
Image block: Avoid remounting to focus caption. (25493)
Add explicit boxSizing style to Placeholder component. (25463)
Remove classic block code used to support WP 4.9. (25365)
Add RichText value type definition. (25363)
Avoid global DOM dependencies. (25332)
Use controls from the Data Controls package instead of local ones. (25235)
RichText: Simplify withFormatTypes as hook. (23145)
Video block: Use hooksHooks In WordPress theme and development, hooks are functions that can be applied to an action or a Filter in WordPress. Actions are functions performed when a certain event occurs in WordPress. Filters allow you to modify certain functions. Arguments used to hook both filters and actions look the same.. (25513)
Remove wp_area custom post typeCustom Post Type WordPress can hold and display many different types of content. A single item of such a content is generally called a post, although post is also a specific post type. Custom Post Types gives your site the ability to have templated posts, to simplify the concept.. (25497)
Post Featured ImageFeatured image A featured image is the main image used on your blog archive page and is pulled when the post or page is shared on social media. The image can be used to display in widget areas on your site or in a summary list of posts.: Remove redundant condition. (25490)
Move legacy-widget block over to edit-widgets package. (25371) (25404)
Don’t use percent units for line-height. (25398)
Change wording and names to not include “whitelist”. (25396)
Don’t discard all promises results when one of them rejects. (25302)
Block Directory: Switch to blocks.registerBlockType filterFilter Filters are one of the two types of Hooks https://codex.wordpress.org/Plugin_API/Hooks. They provide a way for functions to modify data of other functions. They are the counterpart to Actions. Unlike Actions, filters are meant to work in an isolated manner, and should never have side effects such as affecting global variables and output.. (25264)
Fix some javascript warnings. (24996)

Various

Remove the Block-based widgets editor from the customizerCustomizer Tool built into WordPress core that hooks into most modern themes. You can use it to preview and modify many of your site’s appearance settings.. (25626)
Cover block: Remove default position (center/center) className from rendering. (25346)
Fix the default label position in SelectControl. (25427)
DropdownMenu tooltip default to true. (25391)
Pass block pattern name when using replaceBlocks and insertBlocks. (25165). (25433)
Babel Preset: Update Babel version to 7.11.x. (25351)
InputControl: Remove floating label variant. (25308)

Performance Benchmark

Version	Loading Time	KeyPress Event (typing)
Gutenberg 9.1	6.9s	29.04ms
Gutenberg 9.0	6.5s	29.19ms
WordPress 5.5	6.5s	28.01ms

Kudos for all the contributors that helped with the release. 👏

#core-editor, #editor, #gutenberg, #gutenberg-new

Welcome!

Communication

10.0 🤯

Features

Enhancements

New APIs

Bug Fixes

Experiments

Documentation

Code Quality

Tools

Various

Performance Benchmark

Custom icon and background colors in Social Icons

Preferences redesign

Text labels in the Block Toolbar

9.9 🤠

Enhancements

New APIs

Breaking Change

Bug Fixes

Experiments

Documentation

Code Quality

Tools

Various

Performance Benchmark

Block Switcher Shows variation icon

Site Editor now iframed

FSE: No more auto-drafts

9.8 😬

Enhancements

New APIs

Bug Fixes

Performance

Experiments

Documentation

Code Quality

Tools

Various

Performance Benchmark

Block Patterns Drag and Drop

Reusable blocks

Matching block variations

9.7 😅

Features

Enhancements

New APIs

Bug Fixes

Experiments

Documentation

Code Quality

Tools

Performance Benchmark

Dragging blocks from the inserter

Vertical layout for buttons

9.6.0 🇨🇱

Features

Enhancements

New APIs

Bug Fixes

Performance

Experiments

Documentation

Code Quality

Tools

Various

Performance Benchmark

Full Height Alignment

Font sizes support in Code block

9.5.0 🇲🇪

Features

Enhancements

New APIs

Bug Fixes

Performance

Experiments

Documentation

Code Quality

Build Tooling