Code quality: Fix typos

backport-changelog/readme.md

@@ -20,7 +20,7 @@ The filename is the Core PR number.
 
 For example, if your Core PR number is `1234` and is slated to be part of the WordPress 6.9 release, the filename will be `1234.md`, and will be placed in the `/backport-changelog/6.9` directory.
 
-The content of the markdown file should be the Github URL of the Core PR, followed by a list of Gutenberg PR Github URLs whose changes are backported in the Core PR.
+The content of the markdown file should be the GitHub URL of the Core PR, followed by a list of Gutenberg PR GitHub URLs whose changes are backported in the Core PR.
 
 A single Core PR may contain changes from one or multiple Gutenberg PRs.
 
@@ -51,7 +51,7 @@ For the backport changelog, Gutenberg uses individual files as opposed to a sing
 
 Some Gutenberg PRs may be flagged as needing a core backport PR when they don't, for example when the PR contains minor comment changes, or the changes already exist in Core.
 
-For individual PRs, there are two Github labels that can be used to exclude a PR from the backport changelog CI check:
+For individual PRs, there are two GitHub labels that can be used to exclude a PR from the backport changelog CI check:
 
 - `Backport from WordPress Core` - Indicates that the PR is a backport from WordPress Core and doesn't need a Core PR.
 - `No Core Sync Required` - Indicates that any changes do not need to be synced to WordPress Core.

bin/api-docs/gen-block-lib-list.js

@@ -108,12 +108,12 @@ function processObjWithInnerKeys( obj ) {
  * not disabled. So adding { color: 'link' } support also brings along
  * background and text.
  *
- * @param {Object} supports - keys supported by blokc
+ * @param {Object} supports - keys supported by block
  * @return {Object} supports augmented with defaults
  */
 function augmentSupports( supports ) {
 	if ( 'color' in supports ) {
-		// If backgroud or text is not specified (true or false)
+		// If background or text is not specified (true or false)
 		// then add it as true.a
 		if ( ! ( 'background' in supports.color ) ) {
 			supports.color.background = true;

bin/plugin/commands/changelog.js

@@ -88,7 +88,7 @@ const LABEL_TYPE_MAPPING = {
 };
 
 /**
- * Mapping of label names to arbitary features in the release notes.
+ * Mapping of label names to arbitrary features in the release notes.
  *
  * Mapping a given label to a feature will guarantee it will be categorised
  * under that feature name in the changelog within each section.
@@ -274,7 +274,7 @@ function mapLabelsToFeatures( labels ) {
  *
  * @param {string[]} labels Label names.
  *
- * @return {boolean} whether or not the issue's is labbeled as block specific
+ * @return {boolean} whether or not the issue's is labeled as block specific
  */
 function getIsBlockSpecificIssue( labels ) {
 	return !! labels.find( ( label ) => label.startsWith( '[Block] ' ) );
@@ -343,7 +343,7 @@ function getIssueFeature( issue ) {
 
 	// 1. Prefer explicit mapping of label to feature.
 	if ( featureCandidates.length ) {
-		// Get occurances of the feature labels.
+		// Get occurrences of the feature labels.
 		const featureCounts = featureCandidates.reduce(
 			/**
 			 * @param {Record<string,number>} acc     Accumulator
@@ -941,7 +941,7 @@ function skipCreatedByBots( pullRequests ) {
 }
 
 /**
- * Produces the formatted markdown for the contributor props seciton.
+ * Produces the formatted markdown for the contributor props section.
  *
  * @param {IssuesListForRepoResponseItem[]} pullRequests List of pull requests.
  *

bin/plugin/commands/test/changelog.js

@@ -260,7 +260,7 @@ describe( 'getIssueFeature', () => {
 					name: '[Package] This package',
 				},
 				{
-					name: '[Feature] Cool Feature', // Should have priority despite prescence of block specific label.
+					name: '[Feature] Cool Feature', // Should have priority despite presence of block specific label.
 				},
 				{
 					name: '[Package] Another One',

docs/contributors/code/release.md

@@ -234,7 +234,7 @@ It's important to check that:
 - the plugin from the directory works as expected
 - the ZIP contents (see [Downloads](https://plugins.trac.wordpress.org/browser/gutenberg/)) looks correct (doesn't have anything obvious missing)
 - the [Gutenberg SVN repo](https://plugins.trac.wordpress.org/browser/gutenberg/) has two new commits (see [the log](https://plugins.trac.wordpress.org/browser/gutenberg/)):
-  - the `trunk` folder should have "Commiting version X.Y.Z"
+  - the `trunk` folder should have "Committing version X.Y.Z"
   - there is a new `tags/X.Y.Z` folder with the same contents as `trunk` whose latest commit is "Tagging version X.Y.Z"
 
 Most likely, the tag folder couldn't be created. This is a [known issue](https://plugins.trac.wordpress.org/browser/gutenberg/) that [can be fixed manually](https://github.com/WordPress/gutenberg/issues/55295#issuecomment-1759292978).

docs/manifest.json

@@ -517,7 +517,7 @@
 	},
 	{
 		"title": "Understanding global state, local context and derived state",
-		"slug": "undestanding-global-state-local-context-and-derived-state",
+		"slug": "understanding-global-state-local-context-and-derived-state",
 		"markdown_source": "../docs/reference-guides/interactivity-api/core-concepts/undestanding-global-state-local-context-and-derived-state.md",
 		"parent": "core-concepts"
 	},

docs/reference-guides/block-api/block-bindings.md

@@ -148,7 +148,7 @@ The function to register a custom source is `registerBlockBindingsSource( args )
 
 - `args`: `object` with the following structure:
     - `name`: `string` with the unique and machine-readable name.
-    - `label`: `string` with the human readable name of the custom source. In case it was defined already on the server, the server label will be overriden by this one, in that case, it is not recommended to be defined here. (optional)
+    - `label`: `string` with the human readable name of the custom source. In case it was defined already on the server, the server label will be overridden by this one, in that case, it is not recommended to be defined here. (optional)
     - `usesContext`: `array` with the block context that the custom source may need. In case it was defined already on the server, it should not be defined here. (optional)
     - `getValues`: `function` that retrieves the values from the source. (optional)
     - `setValues`: `function` that allows updating the values connected to the source. (optional)

docs/reference-guides/data/data-core-block-editor.md

@@ -521,7 +521,7 @@ _Properties_
 
 -   _name_ `string`: The type of block.
 -   _attributes_ `?Object`: Attributes to pass to the newly created block.
--   _attributesToCopy_ `?Array<string>`: Attributes to be copied from adjecent blocks when inserted.
+-   _attributesToCopy_ `?Array<string>`: Attributes to be copied from adjacent blocks when inserted.
 
 ### getDraggedBlockClientIds
 
@@ -714,7 +714,7 @@ Returns the list of patterns based on their declared `blockTypes` and a block's
 _Parameters_
 
 -   _state_ `Object`: Editor state.
--   _blockNames_ `string|string[]`: Block's name or array of block names to find matching pattens.
+-   _blockNames_ `string|string[]`: Block's name or array of block names to find matching patterns.
 -   _rootClientId_ `?string`: Optional target root client ID.
 
 _Returns_

docs/reference-guides/data/data-core.md

@@ -878,7 +878,7 @@ _Returns_
 
 ### redo
 
-Action triggered to redo the last undoed edit to an entity record, if any.
+Action triggered to redo the last undone edit to an entity record, if any.
 
 ### saveEditedEntityRecord
 

docs/reference-guides/interactivity-api/core-concepts/server-side-rendering.md

@@ -175,7 +175,7 @@ store( 'myFruitPlugin', {
 
 The derived state, regardless of whether it derives from the global state, local context, or both, can also be processed on the server by the Server Directive Processing.
 
-_Please, visit the [Understanding global state, local context and derived state](./undestanding-global-state-local-context-and-derived-state.md) guide to learn more about how derived state works in the Interactivity API._
+_Please, visit the [Understanding global state, local context and derived state](./understanding-global-state-local-context-and-derived-state.md) guide to learn more about how derived state works in the Interactivity API._
 
 ### Derived state that can be defined statically
 

docs/reference-guides/interactivity-api/core-concepts/using-typescript.md

@@ -6,7 +6,7 @@ These are the core principles of TypeScript's interaction with the Interactivity
 
 -   **Inferred client types**: When you create a store using the `store` function, TypeScript automatically infers the types of the store's properties (`state`, `actions`, etc.). This means that you can often get away with just writing plain JavaScript objects, and TypeScript will figure out the types for you.
 -   **Explicit server types**: When dealing with data defined on the server, like local context or the initial values of the global state, you can explicitly define its types to ensure that everything is correctly typed.
--   **Mutiple store parts**: Even if your store is split into multiple parts, you can define or infer the types of each part of the store and then merge them into a single type that represents the entire store.
+-   **Multiple store parts**: Even if your store is split into multiple parts, you can define or infer the types of each part of the store and then merge them into a single type that represents the entire store.
 -   **Typed external stores**: You can import typed stores from external namespaces, allowing you to use other plugins' functionality with type safety.
 
 ## Installing `@wordpress/interactivity` locally
@@ -269,7 +269,7 @@ That's it! Now you can access the context properties with the correct types.
 
 The derived state is data that is calculated based on the global state or local context. In the client store definition, it is defined using a getter in the `state` object.
 
-_Please, visit the [Understanding global state, local context and derived state](./undestanding-global-state-local-context-and-derived-state.md) guide to learn more about how derived state works in the Interactivity API._
+_Please, visit the [Understanding global state, local context and derived state](./understanding-global-state-local-context-and-derived-state.md) guide to learn more about how derived state works in the Interactivity API._
 
 Following our previous example, let's create a derived state that is the double of our counter.
 
@@ -495,7 +495,7 @@ There's something to keep in mind when when using asynchronous actions. Just lik
     		counter: 0,
     	},
     	actions: {
-    		*delayedReturn(): Generator< uknown, number, uknown > {
+    		*delayedReturn(): Generator< unknown, number, unknown > {
     			yield new Promise( ( r ) => setTimeout( r, 1000 ) );
     			return state.counter; // Now this is correctly inferred.
     		},

docs/reference-guides/interactivity-api/iapi-about.md

@@ -186,7 +186,7 @@ Additionally, with a standard, **WordPress can absorb the maximum amount of comp
 
 _Complexities absorbed by the standard_
 
-<img alt="Two columns table comparing some aspects with and without a standard. Without a standard, block developers have to take care of everything, while having a standard. Totally handled by the standard: Tooling, hydration, integrating it with WordPress, SSR of the interactive parts, inter-block communication, and frontend performance. Partially handled: Security, accessibility, and best practices. Developer responsibility: Block logic. In the without a standard column, everything is under the developer responsability." width=60% src="https://make.wordpress.org/core/files/2023/03/standard-graph.png">
+<img alt="Two columns table comparing some aspects with and without a standard. Without a standard, block developers have to take care of everything, while having a standard. Totally handled by the standard: Tooling, hydration, integrating it with WordPress, SSR of the interactive parts, inter-block communication, and frontend performance. Partially handled: Security, accessibility, and best practices. Developer responsibility: Block logic. In the without a standard column, everything is under the developer responsibility." width=60% src="https://make.wordpress.org/core/files/2023/03/standard-graph.png">
 
 
 With this absorption, less knowledge is required to create interactive blocks, and developers have fewer decisions to worry about.

lib/class-wp-theme-json-gutenberg.php

@@ -3415,7 +3415,7 @@ protected static function should_override_preset( $theme_json, $path, $override
 
 	/**
 	 * Returns the default slugs for all the presets in an associative array
-	 * whose keys are the preset paths and the leafs is the list of slugs.
+	 * whose keys are the preset paths and the leaves is the list of slugs.
 	 *
 	 * For example:
 	 *

lib/experimental/media/load.php

@@ -300,24 +300,24 @@ function gutenberg_add_crossorigin_attributes( string $html ): string {
 
 		$processor->set_bookmark( 'resume' );
 
-		$seeked = false;
+		$sought = false;
 
 		$crossorigin = $processor->get_attribute( 'crossorigin' );
 
 		$url = $processor->get_attribute( $tags[ $tag ] );
 
 		if ( is_string( $url ) && ! str_starts_with( $url, $site_url ) && ! str_starts_with( $url, '/' ) && ! is_string( $crossorigin ) ) {
 			if ( 'SOURCE' === $tag ) {
-				$seeked = $processor->seek( 'audio-video-parent' );
+				$sought = $processor->seek( 'audio-video-parent' );
 
-				if ( $seeked ) {
+				if ( $sought ) {
 					$processor->set_attribute( 'crossorigin', 'anonymous' );
 				}
 			} else {
 				$processor->set_attribute( 'crossorigin', 'anonymous' );
 			}
 
-			if ( $seeked ) {
+			if ( $sought ) {
 				$processor->seek( 'resume' );
 				$processor->release_bookmark( 'audio-video-parent' );
 			}

lib/experimental/sync/README.md

@@ -2,7 +2,7 @@
 
 The signaling server allows multiple clients to exchange messages with each other through various communication topics.
 
-Topics are not defined upfront, but clients define them by subscribing to them. By subscribing to a given topic, the client tells the server to keep track of its unread messages in the given topic. By unsubscribing from a topic, the client tells the server to free the bookeeping it maintains for the given client and topic.
+Topics are not defined upfront, but clients define them by subscribing to them. By subscribing to a given topic, the client tells the server to keep track of its unread messages in the given topic. By unsubscribing from a topic, the client tells the server to free the bookkeeping it maintains for the given client and topic.
 
 Every client communicates with the server via `GET` or `POST`. Clients must have a unique identifier, which can be randomly generated. This identifier should be included as a parameter named `subscriber_id` in every request.
 

packages/babel-plugin-makepot/index.js

@@ -85,7 +85,7 @@ const REGEXP_TRANSLATOR_COMMENT = /^\s*translators:\s*([\s\S]+)/im;
 
 /**
  * Given an argument node (or recursed node), attempts to return a string
- * represenation of that node's value.
+ * representation of that node's value.
  *
  * @param {Object} node AST node.
  *
@@ -265,7 +265,7 @@ module.exports = () => {
 						);
 					}
 
-					// Attempt to exract nplurals from header.
+					// Attempt to extract nplurals from header.
 					const pluralsMatch = (
 						baseData.headers[ 'plural-forms' ] || ''
 					).match( /nplurals\s*=\s*(\d+);/ );

packages/base-styles/_variables.scss

@@ -145,7 +145,7 @@ $radio-input-size: 16px;
 $radio-input-size-sm: 24px; // Width & height for small viewports.
 
 // Deprecated, please avoid using these.
-$block-padding: 14px; // Used to define space between block footprint and surrouding borders.
+$block-padding: 14px; // Used to define space between block footprint and surrounding borders.
 $radius-block-ui: $radius-small;
 $shadow-popover: $elevation-x-small;
 $shadow-modal: $elevation-large;

packages/block-editor/CHANGELOG.md

@@ -95,7 +95,7 @@
 
 ### Enhancements
 
--   Embed the `ObserveTyping` behavior within the `BlockList` component making to simplify instanciations of third-party block editors.
+-   Embed the `ObserveTyping` behavior within the `BlockList` component making to simplify instantiations of third-party block editors.
 
 ## 12.8.0 (2023-08-16)
 

packages/block-editor/src/components/block-icon/content.scss

@@ -9,7 +9,7 @@
 		svg {
 			fill: currentColor;
 
-			// Optimizate for high contrast modes.
+			// Optimize for high contrast modes.
 			// See also https://blogs.windows.com/msedgedev/2020/09/17/styling-for-windows-high-contrast-with-new-standards-for-forced-colors/.
 			@media (forced-colors: active) {
 				fill: CanvasText;

packages/block-editor/src/components/block-icon/style.scss

@@ -9,7 +9,7 @@
 		svg {
 			fill: currentColor;
 
-			// Optimizate for high contrast modes.
+			// Optimize for high contrast modes.
 			// See also https://blogs.windows.com/msedgedev/2020/09/17/styling-for-windows-high-contrast-with-new-standards-for-forced-colors/.
 			@media (forced-colors: active) {
 				fill: CanvasText;

packages/block-editor/src/components/block-list/use-block-props/use-focus-handler.js

@@ -48,7 +48,7 @@ export function useFocusHandler( clientId ) {
 					return;
 				}
 
-				// If an inner block is focussed, that block is resposible for
+				// If an inner block is focussed, that block is responsible for
 				// setting the selected block.
 				if ( ! isInsideRootBlock( node, event.target ) ) {
 					return;

packages/block-editor/src/components/block-preview/style.scss

@@ -1,6 +1,6 @@
 // These rules ensure the preview scales smoothly regardless of the container size.
 .block-editor-block-preview__container {
-	// In the component, a top padding is provided as an inline style to provid an aspect-ratio.
+	// In the component, a top padding is provided as an inline style to provide an aspect-ratio.
 	// This positioning enables the content to sit on top of that padding to fit.
 	position: relative;
 

packages/block-editor/src/components/block-styles/preview.native.js

@@ -33,7 +33,7 @@ function StylePreview( { onPress, isActive, style, url } ) {
 
 	function onLayout() {
 		const columnsNum =
-			// To indicate scroll availabilty, there is a need to display additional half the column.
+			// To indicate scroll availability, there is a need to display additional half the column.
 			Math.floor( BottomSheet.getWidth() / MAX_ITEM_WIDTH ) + HALF_COLUMN;
 		setItemWidth( BottomSheet.getWidth() / columnsNum );
 	}

packages/block-editor/src/components/block-switcher/block-transformations-menu.js

@@ -27,20 +27,20 @@ import BlockVariationTransformations from './block-variation-transformations';
  * @return {Record<string, Object[]>} The grouped block transformations.
  */
 function useGroupedTransforms( possibleBlockTransformations ) {
-	const priorityContentTranformationBlocks = {
+	const priorityContentTransformationBlocks = {
 		'core/paragraph': 1,
 		'core/heading': 2,
 		'core/list': 3,
 		'core/quote': 4,
 	};
 	const transformations = useMemo( () => {
-		const priorityTextTranformsNames = Object.keys(
-			priorityContentTranformationBlocks
+		const priorityTextTransformsNames = Object.keys(
+			priorityContentTransformationBlocks
 		);
 		const groupedPossibleTransforms = possibleBlockTransformations.reduce(
 			( accumulator, item ) => {
 				const { name } = item;
-				if ( priorityTextTranformsNames.includes( name ) ) {
+				if ( priorityTextTransformsNames.includes( name ) ) {
 					accumulator.priorityTextTransformations.push( item );
 				} else {
 					accumulator.restTransformations.push( item );
@@ -71,8 +71,8 @@ function useGroupedTransforms( possibleBlockTransformations ) {
 	// Order the priority text transformations.
 	transformations.priorityTextTransformations.sort(
 		( { name: currentName }, { name: nextName } ) => {
-			return priorityContentTranformationBlocks[ currentName ] <
-				priorityContentTranformationBlocks[ nextName ]
+			return priorityContentTransformationBlocks[ currentName ] <
+				priorityContentTransformationBlocks[ nextName ]
 				? -1
 				: 1;
 		}
@@ -125,7 +125,7 @@ const BlockTransformationsMenu = ( {
 					/>
 				) }
 				{ priorityTextTransformations.map( ( item ) => (
-					<BlockTranformationItem
+					<BlockTransformationItem
 						key={ item.name }
 						item={ item }
 						onSelect={ onSelect }
@@ -151,7 +151,7 @@ function RestTransformationItems( {
 	setHoveredTransformItemName,
 } ) {
 	return restTransformations.map( ( item ) => (
-		<BlockTranformationItem
+		<BlockTransformationItem
 			key={ item.name }
 			item={ item }
 			onSelect={ onSelect }
@@ -160,7 +160,7 @@ function RestTransformationItems( {
 	) );
 }
 
-function BlockTranformationItem( {
+function BlockTransformationItem( {
 	item,
 	onSelect,
 	setHoveredTransformItemName,

packages/block-editor/src/components/block-switcher/block-variation-transformations.js

@@ -74,7 +74,7 @@ const BlockVariationTransformations = ( {
 				/>
 			) }
 			{ transformations?.map( ( item ) => (
-				<BlockVariationTranformationItem
+				<BlockVariationTransformationItem
 					key={ item.name }
 					item={ item }
 					onSelect={ onSelect }
@@ -85,7 +85,7 @@ const BlockVariationTransformations = ( {
 	);
 };
 
-function BlockVariationTranformationItem( {
+function BlockVariationTransformationItem( {
 	item,
 	onSelect,
 	setHoveredTransformItemName,