@wordpress/block-editor 15.5.1-next.ff1cebbba.0 → 15.6.1-next.36001005c.0

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@wordpress/block-editor",
-	"version": "15.5.1-next.ff1cebbba.0",
+	"version": "15.6.1-next.36001005c.0",
 	"description": "Generic block editor.",
 	"author": "The WordPress Contributors",
 	"license": "GPL-2.0-or-later",
@@ -56,39 +56,40 @@
 		"@emotion/react": "^11.7.1",
 		"@emotion/styled": "^11.6.0",
 		"@react-spring/web": "^9.4.5",
-		"@wordpress/a11y": "^4.32.1-next.ff1cebbba.0",
-		"@wordpress/api-fetch": "^7.32.1-next.ff1cebbba.0",
-		"@wordpress/base-styles": "^6.8.1-next.ff1cebbba.0",
-		"@wordpress/blob": "^4.32.1-next.ff1cebbba.0",
-		"@wordpress/block-serialization-default-parser": "^5.32.1-next.ff1cebbba.0",
-		"@wordpress/blocks": "^15.5.1-next.ff1cebbba.0",
-		"@wordpress/commands": "^1.32.1-next.ff1cebbba.0",
-		"@wordpress/components": "^30.6.1-next.ff1cebbba.0",
-		"@wordpress/compose": "^7.32.1-next.ff1cebbba.0",
-		"@wordpress/data": "^10.32.1-next.ff1cebbba.0",
-		"@wordpress/date": "^5.32.1-next.ff1cebbba.0",
-		"@wordpress/deprecated": "^4.32.1-next.ff1cebbba.0",
-		"@wordpress/dom": "^4.32.1-next.ff1cebbba.0",
-		"@wordpress/element": "^6.32.1-next.ff1cebbba.0",
-		"@wordpress/escape-html": "^3.32.1-next.ff1cebbba.0",
-		"@wordpress/hooks": "^4.32.1-next.ff1cebbba.0",
-		"@wordpress/html-entities": "^4.32.1-next.ff1cebbba.0",
-		"@wordpress/i18n": "^6.5.1-next.ff1cebbba.0",
-		"@wordpress/icons": "^11.0.1-next.ff1cebbba.0",
-		"@wordpress/is-shallow-equal": "^5.32.1-next.ff1cebbba.0",
-		"@wordpress/keyboard-shortcuts": "^5.32.1-next.ff1cebbba.0",
-		"@wordpress/keycodes": "^4.32.1-next.ff1cebbba.0",
-		"@wordpress/notices": "^5.32.1-next.ff1cebbba.0",
-		"@wordpress/preferences": "^4.32.1-next.ff1cebbba.0",
-		"@wordpress/priority-queue": "^3.32.1-next.ff1cebbba.0",
-		"@wordpress/private-apis": "^1.32.1-next.ff1cebbba.0",
-		"@wordpress/rich-text": "^7.32.1-next.ff1cebbba.0",
-		"@wordpress/style-engine": "^2.32.1-next.ff1cebbba.0",
-		"@wordpress/token-list": "^3.32.1-next.ff1cebbba.0",
-		"@wordpress/upload-media": "^0.17.1-next.ff1cebbba.0",
-		"@wordpress/url": "^4.32.1-next.ff1cebbba.0",
-		"@wordpress/warning": "^3.32.1-next.ff1cebbba.0",
-		"@wordpress/wordcount": "^4.32.1-next.ff1cebbba.0",
+		"@wordpress/a11y": "^4.33.1-next.36001005c.0",
+		"@wordpress/api-fetch": "^7.33.1-next.36001005c.0",
+		"@wordpress/base-styles": "^6.10.1-next.36001005c.0",
+		"@wordpress/blob": "^4.33.1-next.36001005c.0",
+		"@wordpress/block-serialization-default-parser": "^5.33.1-next.36001005c.0",
+		"@wordpress/blocks": "^15.6.1-next.36001005c.0",
+		"@wordpress/commands": "^1.33.1-next.36001005c.0",
+		"@wordpress/components": "^30.7.1-next.36001005c.0",
+		"@wordpress/compose": "^7.33.1-next.36001005c.0",
+		"@wordpress/data": "^10.33.1-next.36001005c.0",
+		"@wordpress/date": "^5.33.1-next.36001005c.0",
+		"@wordpress/deprecated": "^4.33.1-next.36001005c.0",
+		"@wordpress/dom": "^4.33.1-next.36001005c.0",
+		"@wordpress/element": "^6.33.1-next.36001005c.0",
+		"@wordpress/escape-html": "^3.33.1-next.36001005c.0",
+		"@wordpress/global-styles-engine": "^1.0.1-next.36001005c.0",
+		"@wordpress/hooks": "^4.33.1-next.36001005c.0",
+		"@wordpress/html-entities": "^4.33.1-next.36001005c.0",
+		"@wordpress/i18n": "^6.6.1-next.36001005c.0",
+		"@wordpress/icons": "^11.0.1-next.36001005c.0",
+		"@wordpress/is-shallow-equal": "^5.33.1-next.36001005c.0",
+		"@wordpress/keyboard-shortcuts": "^5.33.1-next.36001005c.0",
+		"@wordpress/keycodes": "^4.33.1-next.36001005c.0",
+		"@wordpress/notices": "^5.33.1-next.36001005c.0",
+		"@wordpress/preferences": "^4.33.1-next.36001005c.0",
+		"@wordpress/priority-queue": "^3.33.1-next.36001005c.0",
+		"@wordpress/private-apis": "^1.33.1-next.36001005c.0",
+		"@wordpress/rich-text": "^7.33.1-next.36001005c.0",
+		"@wordpress/style-engine": "^2.33.1-next.36001005c.0",
+		"@wordpress/token-list": "^3.33.1-next.36001005c.0",
+		"@wordpress/upload-media": "^0.18.1-next.36001005c.0",
+		"@wordpress/url": "^4.33.1-next.36001005c.0",
+		"@wordpress/warning": "^3.33.1-next.36001005c.0",
+		"@wordpress/wordcount": "^4.33.1-next.36001005c.0",
 		"change-case": "^4.1.2",
 		"clsx": "^2.1.1",
 		"colord": "^2.7.0",
@@ -111,5 +112,5 @@
 	"publishConfig": {
 		"access": "public"
 	},
-	"gitHead": "c5b659710aff01d40d2eb97b211eb2cec9c07d3b"
+	"gitHead": "b73a8a22e779c59efb8f911e32b681652f237d60"
 }

package/src/components/background-image-control/index.js

@@ -33,11 +33,11 @@ import { useRef, useState, useEffect, useMemo } from '@wordpress/element';
 import { useDispatch, useSelect } from '@wordpress/data';
 import { focus } from '@wordpress/dom';
 import { isBlobURL } from '@wordpress/blob';
+import { getResolvedValue } from '@wordpress/global-styles-engine';
 
 /**
  * Internal dependencies
  */
-import { getResolvedValue } from '../global-styles/utils';
 import { hasBackgroundImageValue } from '../global-styles/background-panel';
 import { setImmutably } from '../../utils/object';
 import MediaReplaceFlow from '../media-replace-flow';

package/src/components/block-card/style.scss

@@ -9,7 +9,7 @@
 }
 
 .block-editor-block-card__title {
-	font-weight: 500;
+	font-weight: $font-weight-medium;
 	display: flex;
 	align-items: center;
 	flex-wrap: wrap;

package/src/components/block-edit/edit.js

@@ -123,7 +123,7 @@ const EditWithGeneratedProps = ( props ) => {
 				const source = registeredSources[ sourceName ];
 				if (
 					! source ||
-					! bindableAttributes.includes( attributeName )
+					! bindableAttributes?.includes( attributeName )
 				) {
 					continue;
 				}
@@ -202,7 +202,7 @@ const EditWithGeneratedProps = ( props ) => {
 				) ) {
 					if (
 						! blockBindings[ attributeName ] ||
-						! bindableAttributes.includes( attributeName )
+						! bindableAttributes?.includes( attributeName )
 					) {
 						continue;
 					}

package/src/components/block-navigation/style.scss

@@ -10,5 +10,5 @@
 	color: $gray-700;
 	text-transform: uppercase;
 	font-size: 11px;
-	font-weight: 500;
+	font-weight: $font-weight-medium;
 }

package/src/components/block-quick-navigation/index.js

@@ -60,6 +60,7 @@ function BlockQuickNavigationItem( { clientId, onSelect } ) {
 	return (
 		<Button
 			__next40pxDefaultSize
+			className="block-editor-block-quick-navigation__item"
 			isPressed={ isSelected }
 			onClick={ async () => {
 				await selectBlock( clientId );

package/src/components/block-quick-navigation/style.scss

@@ -0,0 +1,5 @@
+@use "@wordpress/base-styles/variables";
+
+.block-editor-block-quick-navigation__item {
+	font-weight: variables.$font-weight-regular;
+}

package/src/components/block-switcher/style.scss

@@ -94,7 +94,7 @@
 	color: $gray-700;
 	text-transform: uppercase;
 	font-size: 11px;
-	font-weight: 500;
+	font-weight: $font-weight-medium;
 }
 
 // The block switcher in the contextual toolbar should be bigger.

package/src/components/color-palette/test/__snapshots__/control.js.snap

@@ -42,7 +42,7 @@ exports[`ColorPaletteControl matches the snapshot 1`] = `
 
 .emotion-6 {
   font-size: 11px;
-  font-weight: 500;
+  font-weight: 499;
   line-height: 1.4;
   text-transform: uppercase;
   display: block;

package/src/components/global-styles/border-panel.js

@@ -11,13 +11,14 @@ import {
 } from '@wordpress/components';
 import { useCallback, useMemo } from '@wordpress/element';
 import { __ } from '@wordpress/i18n';
+import { getValueFromVariable } from '@wordpress/global-styles-engine';
 
 /**
  * Internal dependencies
  */
 import BorderRadiusControl from '../border-radius-control';
 import { useColorsPerOrigin } from './hooks';
-import { getValueFromVariable, useToolsPanelDropdownMenuProps } from './utils';
+import { useToolsPanelDropdownMenuProps } from './utils';
 import { setImmutably } from '../../utils/object';
 import { useBorderPanelLabel } from '../../hooks/border';
 import { ShadowPopover, useShadowPresets } from './shadow-panel-components';

package/src/components/global-styles/color-panel.js

@@ -21,13 +21,14 @@ import {
 } from '@wordpress/components';
 import { useCallback, useRef } from '@wordpress/element';
 import { __ } from '@wordpress/i18n';
+import { getValueFromVariable } from '@wordpress/global-styles-engine';
 
 /**
  * Internal dependencies
  */
 import ColorGradientControl from '../colors-gradients/control';
 import { useColorsPerOrigin, useGradientsPerOrigin } from './hooks';
-import { getValueFromVariable, useToolsPanelDropdownMenuProps } from './utils';
+import { useToolsPanelDropdownMenuProps } from './utils';
 import { setImmutably } from '../../utils/object';
 import { unlock } from '../../lock-unlock';
 import { reset as resetIcon } from '@wordpress/icons';

package/src/components/global-styles/color-panel.native.js

@@ -5,13 +5,13 @@ import { useSelect } from '@wordpress/data';
 import { useEffect, useState, useMemo, useCallback } from '@wordpress/element';
 import { __ } from '@wordpress/i18n';
 import { store as blockEditorStore } from '@wordpress/block-editor';
+import { getValueFromVariable } from '@wordpress/global-styles-engine';
 
 /**
  * Internal dependencies
  */
 import PanelColorGradientSettings from '../colors-gradients/panel-color-gradient-settings';
 import { useColorsPerOrigin, useGradientsPerOrigin } from './hooks';
-import { getValueFromVariable } from './utils';
 import { setImmutably } from '../../utils/object';
 import ContrastChecker from '../contrast-checker';
 import InspectorControls from '../inspector-controls';

package/src/components/global-styles/dimensions-panel.js

@@ -17,11 +17,12 @@ import {
 } from '@wordpress/components';
 import { Icon, alignNone, stretchWide } from '@wordpress/icons';
 import { useCallback, useState, Platform } from '@wordpress/element';
+import { getValueFromVariable } from '@wordpress/global-styles-engine';
 
 /**
  * Internal dependencies
  */
-import { getValueFromVariable, useToolsPanelDropdownMenuProps } from './utils';
+import { useToolsPanelDropdownMenuProps } from './utils';
 import SpacingSizesControl from '../spacing-sizes-control';
 import HeightControl from '../height-control';
 import ChildLayoutControl from '../child-layout-control';

package/src/components/global-styles/filters-panel.js

@@ -24,11 +24,12 @@ import {
 import { __, _x } from '@wordpress/i18n';
 import { useCallback, useMemo, useRef } from '@wordpress/element';
 import { reset as resetIcon } from '@wordpress/icons';
+import { getValueFromVariable } from '@wordpress/global-styles-engine';
 
 /**
  * Internal dependencies
  */
-import { getValueFromVariable, useToolsPanelDropdownMenuProps } from './utils';
+import { useToolsPanelDropdownMenuProps } from './utils';
 import { setImmutably } from '../../utils/object';
 
 const EMPTY_ARRAY = [];

package/src/components/global-styles/hooks.js

@@ -10,81 +10,21 @@ import { useContext, useCallback, useMemo } from '@wordpress/element';
 import { useSelect } from '@wordpress/data';
 import { store as blocksStore } from '@wordpress/blocks';
 import { _x } from '@wordpress/i18n';
+import {
+	getSetting,
+	getStyle,
+	getPresetVariableFromValue,
+} from '@wordpress/global-styles-engine';
 
 /**
  * Internal dependencies
  */
-import { getValueFromVariable, getPresetVariableFromValue } from './utils';
-import { getValueFromObjectPath, setImmutably } from '../../utils/object';
+import { setImmutably } from '../../utils/object';
 import { GlobalStylesContext } from './context';
 import { unlock } from '../../lock-unlock';
 
 const EMPTY_CONFIG = { settings: {}, styles: {} };
 
-const VALID_SETTINGS = [
-	'appearanceTools',
-	'useRootPaddingAwareAlignments',
-	'background.backgroundImage',
-	'background.backgroundRepeat',
-	'background.backgroundSize',
-	'background.backgroundPosition',
-	'border.color',
-	'border.radius',
-	'border.style',
-	'border.width',
-	'border.radiusSizes',
-	'shadow.presets',
-	'shadow.defaultPresets',
-	'color.background',
-	'color.button',
-	'color.caption',
-	'color.custom',
-	'color.customDuotone',
-	'color.customGradient',
-	'color.defaultDuotone',
-	'color.defaultGradients',
-	'color.defaultPalette',
-	'color.duotone',
-	'color.gradients',
-	'color.heading',
-	'color.link',
-	'color.palette',
-	'color.text',
-	'custom',
-	'dimensions.aspectRatio',
-	'dimensions.minHeight',
-	'layout.contentSize',
-	'layout.definitions',
-	'layout.wideSize',
-	'lightbox.enabled',
-	'lightbox.allowEditing',
-	'position.fixed',
-	'position.sticky',
-	'spacing.customSpacingSize',
-	'spacing.defaultSpacingSizes',
-	'spacing.spacingSizes',
-	'spacing.spacingScale',
-	'spacing.blockGap',
-	'spacing.margin',
-	'spacing.padding',
-	'spacing.units',
-	'typography.fluid',
-	'typography.customFontSize',
-	'typography.defaultFontSizes',
-	'typography.dropCap',
-	'typography.fontFamilies',
-	'typography.fontSizes',
-	'typography.fontStyle',
-	'typography.fontWeight',
-	'typography.letterSpacing',
-	'typography.lineHeight',
-	'typography.textAlign',
-	'typography.textColumns',
-	'typography.textDecoration',
-	'typography.textTransform',
-	'typography.writingMode',
-];
-
 export const useGlobalStylesReset = () => {
 	const { user, setUserConfig } = useContext( GlobalStylesContext );
 	const config = {
@@ -103,7 +43,6 @@ export function useGlobalSetting( propertyPath, blockName, source = 'all' ) {
 	const appendedBlockPath = blockName ? '.blocks.' + blockName : '';
 	const appendedPropertyPath = propertyPath ? '.' + propertyPath : '';
 	const contextualPath = `settings${ appendedBlockPath }${ appendedPropertyPath }`;
-	const globalPath = `settings${ appendedPropertyPath }`;
 	const sourceKey = source === 'all' ? 'merged' : source;
 
 	const settingValue = useMemo( () => {
@@ -112,34 +51,9 @@ export function useGlobalSetting( propertyPath, blockName, source = 'all' ) {
 			throw 'Unsupported source';
 		}
 
-		if ( propertyPath ) {
-			return (
-				getValueFromObjectPath( configToUse, contextualPath ) ??
-				getValueFromObjectPath( configToUse, globalPath )
-			);
-		}
-
-		let result = {};
-		VALID_SETTINGS.forEach( ( setting ) => {
-			const value =
-				getValueFromObjectPath(
-					configToUse,
-					`settings${ appendedBlockPath }.${ setting }`
-				) ??
-				getValueFromObjectPath( configToUse, `settings.${ setting }` );
-			if ( value !== undefined ) {
-				result = setImmutably( result, setting.split( '.' ), value );
-			}
-		} );
-		return result;
-	}, [
-		configs,
-		sourceKey,
-		propertyPath,
-		contextualPath,
-		globalPath,
-		appendedBlockPath,
-	] );
+		// Use engine's getSetting instead of duplicating logic
+		return getSetting( configToUse, propertyPath, blockName );
+	}, [ configs, sourceKey, propertyPath, blockName ] );
 
 	const setSetting = ( newValue ) => {
 		setUserConfig( ( currentConfig ) =>
@@ -183,25 +97,32 @@ export function useGlobalStyle(
 		);
 	};
 
-	let rawResult, result;
+	let result;
+	// Use engine's getStyle instead of duplicating logic
 	switch ( source ) {
 		case 'all':
-			rawResult = getValueFromObjectPath( mergedConfig, finalPath );
-			result = shouldDecodeEncode
-				? getValueFromVariable( mergedConfig, blockName, rawResult )
-				: rawResult;
+			result = getStyle(
+				mergedConfig,
+				path,
+				blockName,
+				shouldDecodeEncode
+			);
 			break;
 		case 'user':
-			rawResult = getValueFromObjectPath( userConfig, finalPath );
-			result = shouldDecodeEncode
-				? getValueFromVariable( mergedConfig, blockName, rawResult )
-				: rawResult;
+			result = getStyle(
+				userConfig,
+				path,
+				blockName,
+				shouldDecodeEncode
+			);
 			break;
 		case 'base':
-			rawResult = getValueFromObjectPath( baseConfig, finalPath );
-			result = shouldDecodeEncode
-				? getValueFromVariable( baseConfig, blockName, rawResult )
-				: rawResult;
+			result = getStyle(
+				baseConfig,
+				path,
+				blockName,
+				shouldDecodeEncode
+			);
 			break;
 		default:
 			throw 'Unsupported source';

package/src/components/global-styles/index.js

@@ -4,14 +4,6 @@ export {
 	useGlobalStyle,
 	useSettingsForBlockElement,
 } from './hooks';
-export { getBlockCSSSelector } from './get-block-css-selector';
-export {
-	getLayoutStyles,
-	getBlockSelectors,
-	toStyles,
-	useGlobalStylesOutput,
-	useGlobalStylesOutputWithConfig,
-} from './use-global-styles-output';
 export { GlobalStylesContext } from './context';
 export {
 	default as TypographyPanel,