@wordpress/block-library 11.0.0 → 11.0.2-next.v.202609171837.0

package/src/utils/test/waveform-player.jsdom.test.jsx

@@ -1,4 +1,5 @@
-import '@testing-library/jest-dom';
+import { afterEach, beforeEach, describe, expect, it, vi } from 'vitest';
+import '@testing-library/jest-dom/vitest';
 import { act, render } from '@testing-library/react';
 import { WaveformPlayer } from '../waveform-player';
 import {
@@ -7,11 +8,11 @@ import {
 	setupPlayButtonArtwork,
 } from '../waveform-utils';
 
-jest.mock( '../waveform-utils', () => ( {
-	applyWaveformPlayerStyles: jest.fn(),
-	initWaveformPlayer: jest.fn(),
-	setupPlayButtonArtwork: jest.fn(),
-	updateSeekControlLabel: jest.fn(),
+vi.mock( import( '../waveform-utils' ), () => ( {
+	applyWaveformPlayerStyles: vi.fn(),
+	initWaveformPlayer: vi.fn(),
+	setupPlayButtonArtwork: vi.fn(),
+	updateSeekControlLabel: vi.fn(),
 } ) );
 
 /**
@@ -51,8 +52,8 @@ function createFakePlayer( options, element ) {
 		titleEl,
 		artistEl: artistEl || null,
 		artworkEl: artworkEl || null,
-		pause: jest.fn(),
-		syncArtist: jest.fn( ( artist ) => {
+		pause: vi.fn(),
+		syncArtist: vi.fn( ( artist ) => {
 			if ( ! artist ) {
 				instance.artistEl?.remove();
 				instance.artistEl = null;
@@ -65,7 +66,7 @@ function createFakePlayer( options, element ) {
 			instance.artistEl.textContent = artist;
 			instance.artistEl.style.display = '';
 		} ),
-		syncArtwork: jest.fn( ( image, imageAlt = '' ) => {
+		syncArtwork: vi.fn( ( image, imageAlt = '' ) => {
 			if ( ! image ) {
 				instance.artworkEl?.remove();
 				instance.artworkEl = null;
@@ -78,7 +79,7 @@ function createFakePlayer( options, element ) {
 			instance.artworkEl.src = image;
 			instance.artworkEl.alt = imageAlt || '';
 		} ),
-		loadTrack: jest.fn( async ( src, title, artist, trackOptions ) => {
+		loadTrack: vi.fn( async ( src, title, artist, trackOptions ) => {
 			titleEl.textContent = title;
 			instance.syncArtist( artist );
 			instance.syncArtwork(
@@ -91,21 +92,21 @@ function createFakePlayer( options, element ) {
 	return {
 		instance,
 		container: element,
-		destroy: jest.fn(),
+		destroy: vi.fn(),
 	};
 }
 
 describe( 'WaveformPlayer', () => {
 	beforeEach( () => {
-		jest.useFakeTimers();
+		vi.useFakeTimers();
 		initWaveformPlayer.mockImplementation( ( element, options ) =>
 			createFakePlayer( options, element )
 		);
 	} );
 
 	afterEach( () => {
-		jest.runOnlyPendingTimers();
-		jest.useRealTimers();
+		vi.runOnlyPendingTimers();
+		vi.useRealTimers();
 		applyWaveformPlayerStyles.mockReset();
 		initWaveformPlayer.mockReset();
 		setupPlayButtonArtwork.mockReset();
@@ -124,7 +125,7 @@ describe( 'WaveformPlayer', () => {
 		render( <WaveformPlayer { ...baseProps } /> );
 
 		act( () => {
-			jest.advanceTimersByTime( 100 );
+			vi.advanceTimersByTime( 100 );
 		} );
 
 		expect( initWaveformPlayer ).toHaveBeenCalledTimes( 1 );
@@ -145,7 +146,7 @@ describe( 'WaveformPlayer', () => {
 		render( <WaveformPlayer { ...baseProps } showPlayButtonArtwork /> );
 
 		act( () => {
-			jest.advanceTimersByTime( 100 );
+			vi.advanceTimersByTime( 100 );
 		} );
 
 		expect( initWaveformPlayer ).toHaveBeenCalledWith(
@@ -169,7 +170,7 @@ describe( 'WaveformPlayer', () => {
 		);
 
 		act( () => {
-			jest.advanceTimersByTime( 100 );
+			vi.advanceTimersByTime( 100 );
 		} );
 
 		expect( initWaveformPlayer ).toHaveBeenCalledWith(
@@ -190,7 +191,7 @@ describe( 'WaveformPlayer', () => {
 		render( <WaveformPlayer { ...baseProps } showPlayButtonArtwork /> );
 
 		act( () => {
-			jest.advanceTimersByTime( 100 );
+			vi.advanceTimersByTime( 100 );
 		} );
 
 		const player = initWaveformPlayer.mock.results[ 0 ].value;
@@ -204,7 +205,7 @@ describe( 'WaveformPlayer', () => {
 		);
 
 		act( () => {
-			jest.advanceTimersByTime( 100 );
+			vi.advanceTimersByTime( 100 );
 		} );
 
 		const player = initWaveformPlayer.mock.results[ 0 ].value;
@@ -228,7 +229,7 @@ describe( 'WaveformPlayer', () => {
 		const { rerender } = render( <WaveformPlayer { ...baseProps } /> );
 
 		act( () => {
-			jest.advanceTimersByTime( 100 );
+			vi.advanceTimersByTime( 100 );
 		} );
 
 		const player = initWaveformPlayer.mock.results[ 0 ].value;
@@ -262,7 +263,7 @@ describe( 'WaveformPlayer', () => {
 		const { rerender } = render( <WaveformPlayer { ...baseProps } /> );
 
 		act( () => {
-			jest.advanceTimersByTime( 100 );
+			vi.advanceTimersByTime( 100 );
 		} );
 
 		const player = initWaveformPlayer.mock.results[ 0 ].value;
@@ -275,7 +276,7 @@ describe( 'WaveformPlayer', () => {
 		);
 
 		act( () => {
-			jest.advanceTimersByTime( 100 );
+			vi.advanceTimersByTime( 100 );
 		} );
 
 		expect( player.destroy ).not.toHaveBeenCalled();
@@ -297,7 +298,7 @@ describe( 'WaveformPlayer', () => {
 		);
 
 		act( () => {
-			jest.advanceTimersByTime( 100 );
+			vi.advanceTimersByTime( 100 );
 		} );
 
 		const player = initWaveformPlayer.mock.results[ 0 ].value;
@@ -305,7 +306,7 @@ describe( 'WaveformPlayer', () => {
 		rerender( <WaveformPlayer { ...baseProps } showPlayButtonArtwork /> );
 
 		act( () => {
-			jest.advanceTimersByTime( 100 );
+			vi.advanceTimersByTime( 100 );
 		} );
 
 		expect( player.destroy ).toHaveBeenCalledTimes( 1 );
@@ -326,7 +327,7 @@ describe( 'WaveformPlayer', () => {
 		);
 
 		act( () => {
-			jest.advanceTimersByTime( 100 );
+			vi.advanceTimersByTime( 100 );
 		} );
 
 		const player = initWaveformPlayer.mock.results[ 0 ].value;
@@ -334,7 +335,7 @@ describe( 'WaveformPlayer', () => {
 		rerender( <WaveformPlayer { ...baseProps } color="#0000ff" /> );
 
 		act( () => {
-			jest.advanceTimersByTime( 100 );
+			vi.advanceTimersByTime( 100 );
 		} );
 
 		expect( player.destroy ).toHaveBeenCalledTimes( 1 );
@@ -353,7 +354,7 @@ describe( 'WaveformPlayer', () => {
 		);
 
 		act( () => {
-			jest.advanceTimersByTime( 100 );
+			vi.advanceTimersByTime( 100 );
 		} );
 
 		const player = initWaveformPlayer.mock.results[ 0 ].value;
@@ -385,7 +386,7 @@ describe( 'WaveformPlayer', () => {
 		);
 
 		act( () => {
-			jest.advanceTimersByTime( 100 );
+			vi.advanceTimersByTime( 100 );
 		} );
 
 		const player = initWaveformPlayer.mock.results[ 0 ].value;
@@ -398,7 +399,7 @@ describe( 'WaveformPlayer', () => {
 		);
 
 		act( () => {
-			jest.advanceTimersByTime( 100 );
+			vi.advanceTimersByTime( 100 );
 		} );
 
 		expect( player.destroy ).toHaveBeenCalledTimes( 1 );
@@ -418,7 +419,7 @@ describe( 'WaveformPlayer', () => {
 		);
 
 		act( () => {
-			jest.advanceTimersByTime( 100 );
+			vi.advanceTimersByTime( 100 );
 		} );
 
 		const firstPlayer = initWaveformPlayer.mock.results[ 0 ].value;
@@ -433,7 +434,7 @@ describe( 'WaveformPlayer', () => {
 		);
 
 		act( () => {
-			jest.advanceTimersByTime( 100 );
+			vi.advanceTimersByTime( 100 );
 		} );
 
 		expect( firstPlayer.destroy ).not.toHaveBeenCalled();
@@ -448,7 +449,7 @@ describe( 'WaveformPlayer', () => {
 		const { rerender } = render( <WaveformPlayer { ...baseProps } /> );
 
 		act( () => {
-			jest.advanceTimersByTime( 100 );
+			vi.advanceTimersByTime( 100 );
 		} );
 
 		const player = initWaveformPlayer.mock.results[ 0 ].value;
@@ -456,7 +457,7 @@ describe( 'WaveformPlayer', () => {
 		rerender( <WaveformPlayer { ...baseProps } image="" /> );
 
 		act( () => {
-			jest.advanceTimersByTime( 100 );
+			vi.advanceTimersByTime( 100 );
 		} );
 
 		expect( player.destroy ).not.toHaveBeenCalled();
@@ -470,7 +471,7 @@ describe( 'WaveformPlayer', () => {
 		);
 
 		act( () => {
-			jest.advanceTimersByTime( 100 );
+			vi.advanceTimersByTime( 100 );
 		} );
 
 		const firstPlayer = initWaveformPlayer.mock.results[ 0 ].value;
@@ -483,16 +484,13 @@ describe( 'WaveformPlayer', () => {
 		expect( firstPlayer.instance.artistEl ).toHaveTextContent(
 			'New Artist'
 		);
-		expect( firstPlayer.instance.artistEl ).not.toHaveStyle( {
-			display: 'none',
-		} );
 	} );
 
 	it( 'updates the player in place when the artist is removed', () => {
 		const { rerender } = render( <WaveformPlayer { ...baseProps } /> );
 
 		act( () => {
-			jest.advanceTimersByTime( 100 );
+			vi.advanceTimersByTime( 100 );
 		} );
 
 		const player = initWaveformPlayer.mock.results[ 0 ].value;

package/src/utils/test/{waveform-utils.jsdom.test.js → waveform-utils.browser.test.js}

@@ -1,4 +1,5 @@
-import '@testing-library/jest-dom';
+import { afterEach, beforeEach, describe, expect, it, vi } from 'vitest';
+import '@testing-library/jest-dom/vitest';
 import {
 	applyWaveformPlayerStyles,
 	createWaveformContainer,
@@ -20,6 +21,21 @@ const basePlayerData = {
 	buttonColor: '#000000',
 };
 
+function readStyle( element ) {
+	if ( ! element.isConnected ) {
+		let root = element;
+		while ( root.parentElement ) {
+			root = root.parentElement;
+		}
+		document.body.appendChild( root );
+	}
+	return window.getComputedStyle( element );
+}
+
+afterEach( () => {
+	document.body.replaceChildren();
+} );
+
 describe( 'Waveform utilities', () => {
 	describe( 'createWaveformContainer', () => {
 		it( 'should create a container with required data attributes', () => {
@@ -224,9 +240,9 @@ describe( 'Waveform utilities', () => {
 				backgroundColor: '#ffeeaa',
 			} );
 
-			expect( waveformContainer ).toHaveStyle( {
-				backgroundColor: '#ffeeaa',
-			} );
+			expect( readStyle( waveformContainer ).backgroundColor ).toBe(
+				'rgb(255, 238, 170)'
+			);
 		} );
 
 		it( 'applies the waveform background gradient', () => {
@@ -240,9 +256,9 @@ describe( 'Waveform utilities', () => {
 					'linear-gradient(90deg,#ff0000 0%,#0000ff 100%)',
 			} );
 
-			expect( waveformContainer ).toHaveStyle( {
-				background: 'linear-gradient(90deg,#ff0000 0%,#0000ff 100%)',
-			} );
+			expect( readStyle( waveformContainer ).backgroundImage ).toBe(
+				'linear-gradient(90deg, rgb(255, 0, 0) 0%, rgb(0, 0, 255) 100%)'
+			);
 		} );
 
 		it( 'applies the waveform player text color variables', () => {
@@ -252,10 +268,13 @@ describe( 'Waveform utilities', () => {
 				textColor: '#0000ff',
 			} );
 
-			expect( container ).toHaveStyle( {
-				'--wfp-text-color': '#0000ff',
-				'--wfp-text-secondary-color': '#0000ff',
-			} );
+			const style = readStyle( container );
+			expect( style.getPropertyValue( '--wfp-text-color' ) ).toBe(
+				'#0000ff'
+			);
+			expect(
+				style.getPropertyValue( '--wfp-text-secondary-color' )
+			).toBe( '#0000ff' );
 		} );
 
 		it( 'applies the waveform player play button color variable', () => {
@@ -265,9 +284,9 @@ describe( 'Waveform utilities', () => {
 				playButtonColor: '#ff0000',
 			} );
 
-			expect( container ).toHaveStyle( {
-				'--wfp-button-color': '#ff0000',
-			} );
+			expect(
+				readStyle( container ).getPropertyValue( '--wfp-button-color' )
+			).toBe( '#ff0000' );
 		} );
 
 		it( 'applies the waveform player play button gradient', () => {
@@ -281,12 +300,12 @@ describe( 'Waveform utilities', () => {
 					'linear-gradient(90deg,#ff0000 0%,#0000ff 100%)',
 			} );
 
-			expect( playButton ).toHaveStyle( {
-				background: 'linear-gradient(90deg,#ff0000 0%,#0000ff 100%)',
-			} );
-			expect( container ).toHaveStyle( {
-				'--wfp-button-color': '#0000ff',
-			} );
+			expect( readStyle( playButton ).backgroundImage ).toBe(
+				'linear-gradient(90deg, rgb(255, 0, 0) 0%, rgb(0, 0, 255) 100%)'
+			);
+			expect(
+				readStyle( container ).getPropertyValue( '--wfp-button-color' )
+			).toBe( '#0000ff' );
 		} );
 
 		it( 'removes the waveform background color when cleared', () => {
@@ -298,9 +317,9 @@ describe( 'Waveform utilities', () => {
 
 			applyWaveformPlayerStyles( container );
 
-			expect( waveformContainer ).not.toHaveStyle( {
-				backgroundColor: '#ffeeaa',
-			} );
+			expect( readStyle( waveformContainer ).backgroundColor ).not.toBe(
+				'rgb(255, 238, 170)'
+			);
 		} );
 
 		it( 'removes the waveform player text color variables when cleared', () => {
@@ -313,10 +332,11 @@ describe( 'Waveform utilities', () => {
 
 			applyWaveformPlayerStyles( container );
 
-			expect( container ).not.toHaveStyle( {
-				'--wfp-text-color': '#0000ff',
-				'--wfp-text-secondary-color': '#0000ff',
-			} );
+			const style = readStyle( container );
+			expect( style.getPropertyValue( '--wfp-text-color' ) ).toBe( '' );
+			expect(
+				style.getPropertyValue( '--wfp-text-secondary-color' )
+			).toBe( '' );
 		} );
 
 		it( 'removes the waveform player play button color variable when cleared', () => {
@@ -325,9 +345,9 @@ describe( 'Waveform utilities', () => {
 
 			applyWaveformPlayerStyles( container );
 
-			expect( container ).not.toHaveStyle( {
-				'--wfp-button-color': '#ff0000',
-			} );
+			expect(
+				readStyle( container ).getPropertyValue( '--wfp-button-color' )
+			).toBe( '' );
 		} );
 	} );
 
@@ -347,7 +367,7 @@ describe( 'Waveform utilities', () => {
 
 			styleSvgIcons( container, '#000000' );
 
-			expect( path ).toHaveStyle( { fill: '#ffffff' } );
+			expect( readStyle( path ).fill ).toBe( 'rgb(255, 255, 255)' );
 		} );
 
 		it( 'should set black fill for light button colors', () => {
@@ -365,7 +385,7 @@ describe( 'Waveform utilities', () => {
 
 			styleSvgIcons( container, '#ffffff' );
 
-			expect( path ).toHaveStyle( { fill: '#000000' } );
+			expect( readStyle( path ).fill ).toBe( 'rgb(0, 0, 0)' );
 		} );
 
 		it( 'should style multiple SVG paths', () => {
@@ -388,8 +408,8 @@ describe( 'Waveform utilities', () => {
 
 			styleSvgIcons( container, '#000000' );
 
-			expect( path1 ).toHaveStyle( { fill: '#ffffff' } );
-			expect( path2 ).toHaveStyle( { fill: '#ffffff' } );
+			expect( readStyle( path1 ).fill ).toBe( 'rgb(255, 255, 255)' );
+			expect( readStyle( path2 ).fill ).toBe( 'rgb(255, 255, 255)' );
 		} );
 
 		it( 'should handle container with no SVG paths', () => {
@@ -417,7 +437,7 @@ describe( 'Waveform utilities', () => {
 			// A dark blue color.
 			styleSvgIcons( container, '#000080' );
 
-			expect( path ).toHaveStyle( { fill: '#ffffff' } );
+			expect( readStyle( path ).fill ).toBe( 'rgb(255, 255, 255)' );
 		} );
 
 		it( 'should use black for mid-light colors', () => {
@@ -436,7 +456,7 @@ describe( 'Waveform utilities', () => {
 			// A light yellow color.
 			styleSvgIcons( container, '#ffff00' );
 
-			expect( path ).toHaveStyle( { fill: '#000000' } );
+			expect( readStyle( path ).fill ).toBe( 'rgb(0, 0, 0)' );
 		} );
 	} );
 
@@ -455,7 +475,7 @@ describe( 'Waveform utilities', () => {
 			const instance = {
 				container,
 				options: {},
-				applySeekLabel: jest.fn( ( label ) => {
+				applySeekLabel: vi.fn( ( label ) => {
 					seekControl.setAttribute( 'aria-label', label );
 				} ),
 			};
@@ -614,7 +634,7 @@ describe( 'Waveform utilities', () => {
 				'https://example.com/cover.jpg'
 			);
 
-			expect( path ).not.toHaveStyle( { fill: '#ffffff' } );
+			expect( readStyle( path ).fill ).not.toBe( 'rgb(255, 255, 255)' );
 		} );
 
 		it( 'should set artwork state when play button is missing', () => {
@@ -684,19 +704,19 @@ describe( 'Waveform utilities', () => {
 			// from running so the test only exercises the synchronous
 			// construction path, where the crossOrigin behavior is decided
 			// before any request is made.
-			jest.useFakeTimers();
+			vi.useFakeTimers();
 
 			// jsdom does not implement canvas rendering or media playback;
 			// stub them out so the library's construction and destroy paths
 			// do not emit "Not implemented" console errors.
 			jsdomStubs = [
-				jest
+				vi
 					.spyOn( window.HTMLCanvasElement.prototype, 'getContext' )
 					.mockReturnValue( null ),
-				jest
+				vi
 					.spyOn( window.HTMLMediaElement.prototype, 'pause' )
 					.mockImplementation( () => {} ),
-				jest
+				vi
 					.spyOn( window.HTMLMediaElement.prototype, 'load' )
 					.mockImplementation( () => {} ),
 			];
@@ -704,7 +724,7 @@ describe( 'Waveform utilities', () => {
 
 		afterEach( () => {
 			jsdomStubs.forEach( ( stub ) => stub.mockRestore() );
-			jest.useRealTimers();
+			vi.useRealTimers();
 			document.body.innerHTML = '';
 		} );
 
@@ -740,7 +760,7 @@ describe( 'Waveform utilities', () => {
 		let consoleErrorSpy;
 
 		beforeEach( () => {
-			consoleErrorSpy = jest
+			consoleErrorSpy = vi
 				.spyOn( console, 'error' )
 				.mockImplementation( () => {} );
 		} );

package/src/verse/README.md

@@ -35,6 +35,7 @@ _Defined via the [`supports`](https://developer.wordpress.org/block-editor/refer
   - [`fontSize`](https://developer.wordpress.org/block-editor/reference-guides/block-api/block-supports/#typography-fontsize): `true`
   - [`lineHeight`](https://developer.wordpress.org/block-editor/reference-guides/block-api/block-supports/#typography-lineheight): `true`
   - [`textAlign`](https://developer.wordpress.org/block-editor/reference-guides/block-api/block-supports/#typography-textalign): `true`
+- [`shadow`](https://developer.wordpress.org/block-editor/reference-guides/block-api/block-supports/#shadow): `true`
 - [`spacing`](https://developer.wordpress.org/block-editor/reference-guides/block-api/block-supports/#spacing):
   - `margin`: `true`
   - `padding`: `true`

package/src/verse/block.json

@@ -56,6 +56,7 @@
 				"fontSize": true
 			}
 		},
+		"shadow": true,
 		"spacing": {
 			"margin": true,
 			"padding": true,

package/src/verse/style.scss

@@ -5,8 +5,8 @@ pre.wp-block-verse {
 
 	// Prevent text overflow off-screen when the previous block has float.
 	min-width: 1em;
-	// stylelint-disable-next-line declaration-property-value-keyword-no-deprecated -- Pending review of overflow-wrap alternative.
-	word-break: break-word;
+	word-break: normal;
+	overflow-wrap: break-word;
 }
 
 :where(pre.wp-block-verse) {

package/src/video/edit-common-settings.jsx

@@ -1,7 +1,7 @@
 import { __, _x } from '@wordpress/i18n';
 import {
 	ToggleControl,
-	SelectControl,
+	SelectControl as WCSelectControl,
 	__experimentalToolsPanelItem as ToolsPanelItem,
 } from '@wordpress/components';
 import { useMemo, useCallback } from '@wordpress/element';
@@ -134,7 +134,7 @@ const VideoSettings = ( { setAttributes, attributes } ) => {
 							? __( 'Play inline enabled because of Autoplay.' )
 							: __(
 									'When enabled, videos will play directly within the webpage on mobile browsers, instead of opening in a fullscreen player.'
-							  )
+								)
 					}
 				/>
 			</ToolsPanelItem>
@@ -146,7 +146,7 @@ const VideoSettings = ( { setAttributes, attributes } ) => {
 					setAttributes( { preload: 'metadata' } );
 				} }
 			>
-				<SelectControl
+				<WCSelectControl
 					label={ __( 'Preload' ) }
 					value={ preload }
 					onChange={ onChangePreload }

package/src/video/tracks-editor.jsx

@@ -9,7 +9,7 @@ import {
 	Dropdown,
 	Button,
 	TextControl,
-	SelectControl,
+	SelectControl as WCSelectControl,
 	ToggleControl,
 	__experimentalGrid as Grid,
 	__experimentalHStack as HStack,
@@ -135,7 +135,7 @@ function SingleTrackEditor( {
 				/>
 			</Grid>
 			<VStack spacing="4">
-				<SelectControl
+				<WCSelectControl
 					className="block-library-video-tracks-editor__single-track-editor-kind-select"
 					options={ KIND_OPTIONS }
 					value={ kind }

package/build/gallery/flex-styles.cjs.map

@@ -1,7 +0,0 @@
-{
-  "version": 3,
-  "sources": ["../../src/gallery/flex-styles.js"],
-  "sourcesContent": ["import {\n\t__experimentalGetGapCSSValue as getGapCSSValue,\n\tprivateApis as blockEditorPrivateApis,\n\tstore as blockEditorStore,\n\tuseStyleOverride,\n\tuseSettings,\n} from '@wordpress/block-editor';\nimport { useSelect } from '@wordpress/data';\nimport { privateApis as globalStylesEnginePrivateApis } from '@wordpress/global-styles-engine';\nimport { unlock } from '../lock-unlock';\nimport { getGalleryResponsiveFlexCSS } from './responsive-styles';\n\nconst { getResponsiveMediaQueries } = unlock( globalStylesEnginePrivateApis );\nconst { globalStylesDataKey } = unlock( blockEditorPrivateApis );\nconst GALLERY_BLOCK_NAME = 'core/gallery';\n\n// --gallery-block--gutter-size is deprecated. --wp--style--gallery-gap-default should be used by themes that want to set a default\n// gap on the gallery.\nconst FALLBACK_VALUE = `var( --wp--style--gallery-gap-default, var( --gallery-block--gutter-size, var( --wp--style--block-gap, 0.5em ) ) )`;\n\nfunction getGalleryGapCustomPropertyStyle( selector, blockGap ) {\n\tlet column = FALLBACK_VALUE;\n\tif ( blockGap ) {\n\t\tcolumn =\n\t\t\ttypeof blockGap === 'string'\n\t\t\t\t? getGapCSSValue( blockGap ) || FALLBACK_VALUE\n\t\t\t\t: getGapCSSValue( blockGap?.left ) || FALLBACK_VALUE;\n\t}\n\n\t// The unstable gallery gap calculation requires a real value (such as `0px`) and not `0`.\n\treturn `${ selector } {\n\t\t--wp--style--unstable-gallery-gap: ${ column === '0' ? '0px' : column }\n\t}`;\n}\n\nfunction getBlockGapValue( style ) {\n\tif ( ! Object.hasOwn( style?.spacing || {}, 'blockGap' ) ) {\n\t\treturn undefined;\n\t}\n\n\treturn style.spacing.blockGap;\n}\n\nexport default function GalleryFlexStyles( { style, clientId } ) {\n\tconst selector = `.wp-block-gallery-${ clientId }`;\n\tconst [ viewportSettings ] = useSettings( 'viewport' );\n\tconst globalStyles = useSelect(\n\t\t( select ) =>\n\t\t\tselect( blockEditorStore ).getSettings()?.[ globalStylesDataKey ],\n\t\t[]\n\t);\n\tconst globalGalleryStyles =\n\t\tglobalStyles?.blocks?.[ GALLERY_BLOCK_NAME ] || {};\n\tconst styleBlockGap = getBlockGapValue( style );\n\tconst globalGalleryBlockGap =\n\t\tglobalGalleryStyles?.spacing?.blockGap ?? FALLBACK_VALUE;\n\t// Prefer the block's own gap value, then Gallery global styles. Missing\n\t// values fall back to the Gallery blockGap default.\n\tconst blockGap =\n\t\tstyleBlockGap === undefined ? globalGalleryBlockGap : styleBlockGap;\n\tlet css = getGalleryGapCustomPropertyStyle( selector, blockGap );\n\tconst responsiveMediaQueries =\n\t\tgetResponsiveMediaQueries( viewportSettings );\n\n\tObject.entries( responsiveMediaQueries ).forEach(\n\t\t( [ viewport, mediaQuery ] ) => {\n\t\t\tconst styleViewportBlockGap = getBlockGapValue(\n\t\t\t\tstyle?.[ viewport ]\n\t\t\t);\n\t\t\t// Viewport-specific block values win. Gallery global viewport values\n\t\t\t// only apply when the block has no base gap, so they do not override an instance value.\n\t\t\tconst globalViewportBlockGap =\n\t\t\t\tstyleBlockGap === undefined\n\t\t\t\t\t? globalGalleryStyles?.[ viewport ]?.spacing?.blockGap\n\t\t\t\t\t: undefined;\n\t\t\tconst viewportBlockGap =\n\t\t\t\tstyleViewportBlockGap === undefined\n\t\t\t\t\t? globalViewportBlockGap\n\t\t\t\t\t: styleViewportBlockGap;\n\t\t\tif ( viewportBlockGap === undefined || viewportBlockGap === null ) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tcss += `${ mediaQuery }{${ getGalleryGapCustomPropertyStyle(\n\t\t\t\tselector,\n\t\t\t\tviewportBlockGap\n\t\t\t) }}`;\n\t\t}\n\t);\n\tcss += getGalleryResponsiveFlexCSS(\n\t\tselector,\n\t\tstyle,\n\t\tresponsiveMediaQueries\n\t);\n\n\tuseStyleOverride( { css } );\n\n\treturn null;\n}\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,0BAMO;AACP,kBAA0B;AAC1B,kCAA6D;AAC7D,yBAAuB;AACvB,+BAA4C;AAE5C,IAAM,EAAE,0BAA0B,QAAI,2BAAQ,4BAAAA,WAA8B;AAC5E,IAAM,EAAE,oBAAoB,QAAI,2BAAQ,oBAAAC,WAAuB;AAC/D,IAAM,qBAAqB;AAI3B,IAAM,iBAAiB;AAEvB,SAAS,iCAAkC,UAAU,UAAW;AAC/D,MAAI,SAAS;AACb,MAAK,UAAW;AACf,aACC,OAAO,aAAa,eACjB,oBAAAC,8BAAgB,QAAS,KAAK,qBAC9B,oBAAAA,8BAAgB,UAAU,IAAK,KAAK;AAAA,EACzC;AAGA,SAAO,GAAI,QAAS;AAAA,uCACmB,WAAW,MAAM,QAAQ,MAAO;AAAA;AAExE;AAEA,SAAS,iBAAkB,OAAQ;AAClC,MAAK,CAAE,OAAO,OAAQ,OAAO,WAAW,CAAC,GAAG,UAAW,GAAI;AAC1D,WAAO;AAAA,EACR;AAEA,SAAO,MAAM,QAAQ;AACtB;AAEe,SAAR,kBAAoC,EAAE,OAAO,SAAS,GAAI;AAChE,QAAM,WAAW,qBAAsB,QAAS;AAChD,QAAM,CAAE,gBAAiB,QAAI,iCAAa,UAAW;AACrD,QAAM,mBAAe;AAAA,IACpB,CAAE,WACD,OAAQ,oBAAAC,KAAiB,EAAE,YAAY,IAAK,mBAAoB;AAAA,IACjE,CAAC;AAAA,EACF;AACA,QAAM,sBACL,cAAc,SAAU,kBAAmB,KAAK,CAAC;AAClD,QAAM,gBAAgB,iBAAkB,KAAM;AAC9C,QAAM,wBACL,qBAAqB,SAAS,YAAY;AAG3C,QAAM,WACL,kBAAkB,SAAY,wBAAwB;AACvD,MAAI,MAAM,iCAAkC,UAAU,QAAS;AAC/D,QAAM,yBACL,0BAA2B,gBAAiB;AAE7C,SAAO,QAAS,sBAAuB,EAAE;AAAA,IACxC,CAAE,CAAE,UAAU,UAAW,MAAO;AAC/B,YAAM,wBAAwB;AAAA,QAC7B,QAAS,QAAS;AAAA,MACnB;AAGA,YAAM,yBACL,kBAAkB,SACf,sBAAuB,QAAS,GAAG,SAAS,WAC5C;AACJ,YAAM,mBACL,0BAA0B,SACvB,yBACA;AACJ,UAAK,qBAAqB,UAAa,qBAAqB,MAAO;AAClE;AAAA,MACD;AAEA,aAAO,GAAI,UAAW,IAAK;AAAA,QAC1B;AAAA,QACA;AAAA,MACD,CAAE;AAAA,IACH;AAAA,EACD;AACA,aAAO;AAAA,IACN;AAAA,IACA;AAAA,IACA;AAAA,EACD;AAEA,4CAAkB,EAAE,IAAI,CAAE;AAE1B,SAAO;AACR;",
-  "names": ["globalStylesEnginePrivateApis", "blockEditorPrivateApis", "getGapCSSValue", "blockEditorStore"]
-}

package/build-module/gallery/flex-styles.mjs.map

@@ -1,7 +0,0 @@
-{
-  "version": 3,
-  "sources": ["../../src/gallery/flex-styles.js"],
-  "sourcesContent": ["import {\n\t__experimentalGetGapCSSValue as getGapCSSValue,\n\tprivateApis as blockEditorPrivateApis,\n\tstore as blockEditorStore,\n\tuseStyleOverride,\n\tuseSettings,\n} from '@wordpress/block-editor';\nimport { useSelect } from '@wordpress/data';\nimport { privateApis as globalStylesEnginePrivateApis } from '@wordpress/global-styles-engine';\nimport { unlock } from '../lock-unlock';\nimport { getGalleryResponsiveFlexCSS } from './responsive-styles';\n\nconst { getResponsiveMediaQueries } = unlock( globalStylesEnginePrivateApis );\nconst { globalStylesDataKey } = unlock( blockEditorPrivateApis );\nconst GALLERY_BLOCK_NAME = 'core/gallery';\n\n// --gallery-block--gutter-size is deprecated. --wp--style--gallery-gap-default should be used by themes that want to set a default\n// gap on the gallery.\nconst FALLBACK_VALUE = `var( --wp--style--gallery-gap-default, var( --gallery-block--gutter-size, var( --wp--style--block-gap, 0.5em ) ) )`;\n\nfunction getGalleryGapCustomPropertyStyle( selector, blockGap ) {\n\tlet column = FALLBACK_VALUE;\n\tif ( blockGap ) {\n\t\tcolumn =\n\t\t\ttypeof blockGap === 'string'\n\t\t\t\t? getGapCSSValue( blockGap ) || FALLBACK_VALUE\n\t\t\t\t: getGapCSSValue( blockGap?.left ) || FALLBACK_VALUE;\n\t}\n\n\t// The unstable gallery gap calculation requires a real value (such as `0px`) and not `0`.\n\treturn `${ selector } {\n\t\t--wp--style--unstable-gallery-gap: ${ column === '0' ? '0px' : column }\n\t}`;\n}\n\nfunction getBlockGapValue( style ) {\n\tif ( ! Object.hasOwn( style?.spacing || {}, 'blockGap' ) ) {\n\t\treturn undefined;\n\t}\n\n\treturn style.spacing.blockGap;\n}\n\nexport default function GalleryFlexStyles( { style, clientId } ) {\n\tconst selector = `.wp-block-gallery-${ clientId }`;\n\tconst [ viewportSettings ] = useSettings( 'viewport' );\n\tconst globalStyles = useSelect(\n\t\t( select ) =>\n\t\t\tselect( blockEditorStore ).getSettings()?.[ globalStylesDataKey ],\n\t\t[]\n\t);\n\tconst globalGalleryStyles =\n\t\tglobalStyles?.blocks?.[ GALLERY_BLOCK_NAME ] || {};\n\tconst styleBlockGap = getBlockGapValue( style );\n\tconst globalGalleryBlockGap =\n\t\tglobalGalleryStyles?.spacing?.blockGap ?? FALLBACK_VALUE;\n\t// Prefer the block's own gap value, then Gallery global styles. Missing\n\t// values fall back to the Gallery blockGap default.\n\tconst blockGap =\n\t\tstyleBlockGap === undefined ? globalGalleryBlockGap : styleBlockGap;\n\tlet css = getGalleryGapCustomPropertyStyle( selector, blockGap );\n\tconst responsiveMediaQueries =\n\t\tgetResponsiveMediaQueries( viewportSettings );\n\n\tObject.entries( responsiveMediaQueries ).forEach(\n\t\t( [ viewport, mediaQuery ] ) => {\n\t\t\tconst styleViewportBlockGap = getBlockGapValue(\n\t\t\t\tstyle?.[ viewport ]\n\t\t\t);\n\t\t\t// Viewport-specific block values win. Gallery global viewport values\n\t\t\t// only apply when the block has no base gap, so they do not override an instance value.\n\t\t\tconst globalViewportBlockGap =\n\t\t\t\tstyleBlockGap === undefined\n\t\t\t\t\t? globalGalleryStyles?.[ viewport ]?.spacing?.blockGap\n\t\t\t\t\t: undefined;\n\t\t\tconst viewportBlockGap =\n\t\t\t\tstyleViewportBlockGap === undefined\n\t\t\t\t\t? globalViewportBlockGap\n\t\t\t\t\t: styleViewportBlockGap;\n\t\t\tif ( viewportBlockGap === undefined || viewportBlockGap === null ) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tcss += `${ mediaQuery }{${ getGalleryGapCustomPropertyStyle(\n\t\t\t\tselector,\n\t\t\t\tviewportBlockGap\n\t\t\t) }}`;\n\t\t}\n\t);\n\tcss += getGalleryResponsiveFlexCSS(\n\t\tselector,\n\t\tstyle,\n\t\tresponsiveMediaQueries\n\t);\n\n\tuseStyleOverride( { css } );\n\n\treturn null;\n}\n"],
-  "mappings": ";AAAA;AAAA,EACC,gCAAgC;AAAA,EAChC,eAAe;AAAA,EACf,SAAS;AAAA,EACT;AAAA,EACA;AAAA,OACM;AACP,SAAS,iBAAiB;AAC1B,SAAS,eAAe,qCAAqC;AAC7D,SAAS,cAAc;AACvB,SAAS,mCAAmC;AAE5C,IAAM,EAAE,0BAA0B,IAAI,OAAQ,6BAA8B;AAC5E,IAAM,EAAE,oBAAoB,IAAI,OAAQ,sBAAuB;AAC/D,IAAM,qBAAqB;AAI3B,IAAM,iBAAiB;AAEvB,SAAS,iCAAkC,UAAU,UAAW;AAC/D,MAAI,SAAS;AACb,MAAK,UAAW;AACf,aACC,OAAO,aAAa,WACjB,eAAgB,QAAS,KAAK,iBAC9B,eAAgB,UAAU,IAAK,KAAK;AAAA,EACzC;AAGA,SAAO,GAAI,QAAS;AAAA,uCACmB,WAAW,MAAM,QAAQ,MAAO;AAAA;AAExE;AAEA,SAAS,iBAAkB,OAAQ;AAClC,MAAK,CAAE,OAAO,OAAQ,OAAO,WAAW,CAAC,GAAG,UAAW,GAAI;AAC1D,WAAO;AAAA,EACR;AAEA,SAAO,MAAM,QAAQ;AACtB;AAEe,SAAR,kBAAoC,EAAE,OAAO,SAAS,GAAI;AAChE,QAAM,WAAW,qBAAsB,QAAS;AAChD,QAAM,CAAE,gBAAiB,IAAI,YAAa,UAAW;AACrD,QAAM,eAAe;AAAA,IACpB,CAAE,WACD,OAAQ,gBAAiB,EAAE,YAAY,IAAK,mBAAoB;AAAA,IACjE,CAAC;AAAA,EACF;AACA,QAAM,sBACL,cAAc,SAAU,kBAAmB,KAAK,CAAC;AAClD,QAAM,gBAAgB,iBAAkB,KAAM;AAC9C,QAAM,wBACL,qBAAqB,SAAS,YAAY;AAG3C,QAAM,WACL,kBAAkB,SAAY,wBAAwB;AACvD,MAAI,MAAM,iCAAkC,UAAU,QAAS;AAC/D,QAAM,yBACL,0BAA2B,gBAAiB;AAE7C,SAAO,QAAS,sBAAuB,EAAE;AAAA,IACxC,CAAE,CAAE,UAAU,UAAW,MAAO;AAC/B,YAAM,wBAAwB;AAAA,QAC7B,QAAS,QAAS;AAAA,MACnB;AAGA,YAAM,yBACL,kBAAkB,SACf,sBAAuB,QAAS,GAAG,SAAS,WAC5C;AACJ,YAAM,mBACL,0BAA0B,SACvB,yBACA;AACJ,UAAK,qBAAqB,UAAa,qBAAqB,MAAO;AAClE;AAAA,MACD;AAEA,aAAO,GAAI,UAAW,IAAK;AAAA,QAC1B;AAAA,QACA;AAAA,MACD,CAAE;AAAA,IACH;AAAA,EACD;AACA,SAAO;AAAA,IACN;AAAA,IACA;AAAA,IACA;AAAA,EACD;AAEA,mBAAkB,EAAE,IAAI,CAAE;AAE1B,SAAO;AACR;",
-  "names": []
-}