@wordpress/block-editor 16.0.1-next.v.202607070741.0 → 16.2.0

package/src/components/block-visibility/test/use-block-visibility.js

@@ -1,36 +1,25 @@
-/**
- * External dependencies
- */
 import { renderHook } from '@testing-library/react';
-
-/**
- * WordPress dependencies
- */
-import { useViewportMatch } from '@wordpress/compose';
-
+import { useMediaQuery } from '@wordpress/compose';
 // Mock WordPress dependencies before importing the hook
 jest.mock( '@wordpress/compose', () => ( {
-	useViewportMatch: jest.fn(),
+	...jest.requireActual( '@wordpress/compose' ),
+	useMediaQuery: jest.fn(),
 } ) );
-
-/**
- * Internal dependencies
- */
 import useBlockVisibility from '../use-block-visibility';
 
 describe( 'useBlockVisibility', () => {
 	// Helper function to set up viewport matches
-	const setupViewport = ( { isMobileOrLarger, isMediumOrLarger } ) => {
+	const setupViewport = ( { isMobileViewport, isTabletViewport } ) => {
 		if (
-			isMobileOrLarger !== undefined &&
-			isMediumOrLarger !== undefined
+			isMobileViewport !== undefined &&
+			isTabletViewport !== undefined
 		) {
-			useViewportMatch
-				.mockReturnValueOnce( isMobileOrLarger )
-				.mockReturnValueOnce( isMediumOrLarger );
+			useMediaQuery
+				.mockReturnValueOnce( isMobileViewport )
+				.mockReturnValueOnce( isTabletViewport );
 		} else {
-			useViewportMatch.mockReturnValue(
-				isMobileOrLarger ?? isMediumOrLarger ?? true
+			useMediaQuery.mockReturnValue(
+				isMobileViewport ?? isTabletViewport ?? false
 			);
 		}
 	};
@@ -42,7 +31,7 @@ describe( 'useBlockVisibility', () => {
 
 	describe( 'Device type overrides', () => {
 		it( 'should return true when deviceType is Mobile and block is hidden on mobile', () => {
-			setupViewport( { isMobileOrLarger: true } );
+			setupViewport( { isMobileViewport: false } );
 
 			const { result } = renderHook( () =>
 				useBlockVisibility( {
@@ -55,7 +44,7 @@ describe( 'useBlockVisibility', () => {
 		} );
 
 		it( 'should return false when deviceType is Mobile and block is visible on mobile', () => {
-			setupViewport( { isMobileOrLarger: false } );
+			setupViewport( { isMobileViewport: false } );
 
 			const { result } = renderHook( () =>
 				useBlockVisibility( {
@@ -74,7 +63,7 @@ describe( 'useBlockVisibility', () => {
 		} );
 
 		it( 'should return true when deviceType is Tablet and block is hidden on tablet', () => {
-			setupViewport( { isMobileOrLarger: false } );
+			setupViewport( { isMobileViewport: false } );
 
 			const { result } = renderHook( () =>
 				useBlockVisibility( {
@@ -88,8 +77,8 @@ describe( 'useBlockVisibility', () => {
 
 		it( 'should use actual viewport detection when deviceType is Desktop', () => {
 			setupViewport( {
-				isMobileOrLarger: true,
-				isMediumOrLarger: true,
+				isMobileViewport: false,
+				isTabletViewport: false,
 			} );
 
 			const { result } = renderHook( () =>
@@ -106,8 +95,8 @@ describe( 'useBlockVisibility', () => {
 	describe( 'Viewport detection with Desktop deviceType', () => {
 		it( 'should return true when on mobile viewport and block is hidden on mobile', () => {
 			setupViewport( {
-				isMobileOrLarger: false,
-				isMediumOrLarger: false,
+				isMobileViewport: true,
+				isTabletViewport: false,
 			} );
 
 			const { result } = renderHook( () =>
@@ -122,8 +111,8 @@ describe( 'useBlockVisibility', () => {
 
 		it( 'should return false when on mobile viewport and block is visible on mobile', () => {
 			setupViewport( {
-				isMobileOrLarger: false,
-				isMediumOrLarger: false,
+				isMobileViewport: true,
+				isTabletViewport: false,
 			} );
 
 			const { result } = renderHook( () =>
@@ -144,8 +133,8 @@ describe( 'useBlockVisibility', () => {
 
 		it( 'should return true when on tablet viewport and block is hidden on tablet', () => {
 			setupViewport( {
-				isMobileOrLarger: true,
-				isMediumOrLarger: false,
+				isMobileViewport: false,
+				isTabletViewport: true,
 			} );
 
 			const { result } = renderHook( () =>
@@ -160,8 +149,8 @@ describe( 'useBlockVisibility', () => {
 
 		it( 'should return false when on tablet viewport and block is visible on tablet', () => {
 			setupViewport( {
-				isMobileOrLarger: true,
-				isMediumOrLarger: false,
+				isMobileViewport: false,
+				isTabletViewport: true,
 			} );
 
 			const { result } = renderHook( () =>
@@ -182,8 +171,8 @@ describe( 'useBlockVisibility', () => {
 
 		it( 'should return true when on desktop viewport and block is hidden on desktop', () => {
 			setupViewport( {
-				isMobileOrLarger: true,
-				isMediumOrLarger: true,
+				isMobileViewport: false,
+				isTabletViewport: false,
 			} );
 
 			const { result } = renderHook( () =>
@@ -198,8 +187,8 @@ describe( 'useBlockVisibility', () => {
 
 		it( 'should return false when on desktop viewport and block is visible on desktop', () => {
 			setupViewport( {
-				isMobileOrLarger: true,
-				isMediumOrLarger: true,
+				isMobileViewport: false,
+				isTabletViewport: false,
 			} );
 
 			const { result } = renderHook( () =>
@@ -217,11 +206,103 @@ describe( 'useBlockVisibility', () => {
 
 			expect( result.current.isBlockCurrentlyHidden ).toBe( false );
 		} );
+
+		it( 'should use custom viewport breakpoints for viewport detection', () => {
+			setupViewport( {
+				isMobileViewport: false,
+				isTabletViewport: true,
+			} );
+
+			const { result } = renderHook( () =>
+				useBlockVisibility( {
+					blockVisibility: { viewport: { tablet: false } },
+					deviceType: 'desktop',
+					viewportSettings: {
+						mobile: '640px',
+						tablet: '960px',
+					},
+				} )
+			);
+
+			expect( useMediaQuery ).toHaveBeenNthCalledWith(
+				1,
+				'(width <= 640px)',
+				window
+			);
+			expect( useMediaQuery ).toHaveBeenNthCalledWith(
+				2,
+				'(640px < width <= 960px)',
+				window
+			);
+			expect( result.current.currentViewport ).toBe( 'tablet' );
+			expect( result.current.isBlockCurrentlyHidden ).toBe( true );
+		} );
+
+		it( 'should use tablet viewport detection for a single tablet breakpoint', () => {
+			setupViewport( {
+				isMobileViewport: false,
+				isTabletViewport: true,
+			} );
+
+			const { result } = renderHook( () =>
+				useBlockVisibility( {
+					blockVisibility: { viewport: { tablet: false } },
+					deviceType: 'desktop',
+					viewportSettings: {
+						tablet: '64rem',
+					},
+				} )
+			);
+
+			expect( useMediaQuery ).toHaveBeenNthCalledWith(
+				1,
+				undefined,
+				window
+			);
+			expect( useMediaQuery ).toHaveBeenNthCalledWith(
+				2,
+				'(width <= 64rem)',
+				window
+			);
+			expect( result.current.currentViewport ).toBe( 'tablet' );
+			expect( result.current.isBlockCurrentlyHidden ).toBe( true );
+		} );
+
+		it( 'should not use tablet viewport detection when the tablet breakpoint is not larger than mobile', () => {
+			setupViewport( {
+				isMobileViewport: false,
+				isTabletViewport: true,
+			} );
+
+			const { result } = renderHook( () =>
+				useBlockVisibility( {
+					blockVisibility: { viewport: { tablet: false } },
+					deviceType: 'desktop',
+					viewportSettings: {
+						mobile: '960px',
+						tablet: '640px',
+					},
+				} )
+			);
+
+			expect( useMediaQuery ).toHaveBeenNthCalledWith(
+				1,
+				'(width <= 960px)',
+				window
+			);
+			expect( useMediaQuery ).toHaveBeenNthCalledWith(
+				2,
+				undefined,
+				window
+			);
+			expect( result.current.currentViewport ).toBe( 'desktop' );
+			expect( result.current.isBlockCurrentlyHidden ).toBe( false );
+		} );
 	} );
 
 	describe( 'Block visibility (hidden everywhere)', () => {
 		it( 'should return true when blockVisibility is false', () => {
-			setupViewport( { isMobileOrLarger: true } );
+			setupViewport( { isMobileViewport: false } );
 
 			const { result } = renderHook( () =>
 				useBlockVisibility( {
@@ -234,7 +315,7 @@ describe( 'useBlockVisibility', () => {
 		} );
 
 		it( 'should return false when blockVisibility is true and no viewport restrictions', () => {
-			setupViewport( { isMobileOrLarger: true } );
+			setupViewport( { isMobileViewport: false } );
 
 			const { result } = renderHook( () =>
 				useBlockVisibility( {
@@ -247,7 +328,7 @@ describe( 'useBlockVisibility', () => {
 		} );
 
 		it( 'should return false when blockVisibility is undefined', () => {
-			setupViewport( { isMobileOrLarger: true } );
+			setupViewport( { isMobileViewport: false } );
 
 			const { result } = renderHook( () =>
 				useBlockVisibility( {
@@ -260,7 +341,7 @@ describe( 'useBlockVisibility', () => {
 		} );
 
 		it( 'should return true when blockVisibility is false regardless of viewport settings', () => {
-			setupViewport( { isMobileOrLarger: true } );
+			setupViewport( { isMobileViewport: false } );
 
 			const { result } = renderHook( () =>
 				useBlockVisibility( {
@@ -275,7 +356,7 @@ describe( 'useBlockVisibility', () => {
 
 	describe( 'Edge cases', () => {
 		it( 'should return false when no visibility settings are defined', () => {
-			setupViewport( { isMobileOrLarger: true } );
+			setupViewport( { isMobileViewport: false } );
 
 			const { result } = renderHook( () =>
 				useBlockVisibility( {
@@ -288,7 +369,7 @@ describe( 'useBlockVisibility', () => {
 		} );
 
 		it( 'should return false when blockVisibility is undefined', () => {
-			setupViewport( { isMobileOrLarger: true } );
+			setupViewport( { isMobileViewport: false } );
 
 			const { result } = renderHook( () =>
 				useBlockVisibility( {
@@ -302,8 +383,8 @@ describe( 'useBlockVisibility', () => {
 
 		it( 'should default to desktop deviceType when not provided', () => {
 			setupViewport( {
-				isMobileOrLarger: true,
-				isMediumOrLarger: true,
+				isMobileViewport: false,
+				isTabletViewport: false,
 			} );
 
 			const { result } = renderHook( () =>

package/src/components/block-visibility/test/utils.js

@@ -1,12 +1,20 @@
-/**
- * Internal dependencies
- */
 import {
+	getBlockVisibilityViewportEntries,
 	getViewportCheckboxState,
 	getHideEverywhereCheckboxState,
 } from '../utils';
 
 describe( 'block-visibility utils', () => {
+	describe( 'getBlockVisibilityViewportEntries', () => {
+		it( 'returns the configured viewport for a single breakpoint', () => {
+			expect(
+				getBlockVisibilityViewportEntries( { tablet: '64rem' } ).map(
+					( [ key ] ) => key
+				)
+			).toEqual( [ 'desktop', 'tablet' ] );
+		} );
+	} );
+
 	describe( 'getViewportCheckboxState', () => {
 		it( 'should return false for empty or invalid input', () => {
 			expect( getViewportCheckboxState( [], 'mobile' ) ).toBe( false );

package/src/components/block-visibility/use-block-visibility.ts

@@ -0,0 +1,92 @@
+import { useMediaQuery } from '@wordpress/compose';
+import { privateApis as globalStylesEnginePrivateApis } from '@wordpress/global-styles-engine';
+import type { BlockVisibilityViewport } from './constants';
+import { unlock } from '../../lock-unlock';
+
+/**
+ * Viewport breakpoints keyed by viewport. Desktop has no breakpoint: it
+ * applies above the largest configured one.
+ */
+type ViewportBreakpoints = Partial< Record< 'mobile' | 'tablet', string > >;
+
+/**
+ * Block visibility metadata: `false` hides the block on all viewports,
+ * per-viewport `false` flags hide it on specific viewports.
+ */
+export type BlockVisibility =
+	| boolean
+	| {
+			viewport?: Partial< Record< BlockVisibilityViewport, boolean > >;
+	  };
+
+const { getViewportBreakpoints } = unlock< {
+	getViewportBreakpoints: (
+		viewportSettings?: ViewportBreakpoints
+	) => ViewportBreakpoints;
+} >( globalStylesEnginePrivateApis );
+
+type UseBlockVisibilityOptions = {
+	blockVisibility?: BlockVisibility;
+	deviceType?: BlockVisibilityViewport;
+	viewportSettings?: ViewportBreakpoints;
+	view?: Window;
+};
+
+/**
+ * Returns information about the current block visibility state.
+ *
+ * @param options                  Parameters to avoid extra store subscriptions.
+ * @param options.blockVisibility  Block visibility metadata.
+ * @param options.deviceType       Current device type.
+ * @param options.viewportSettings Viewport breakpoint settings.
+ * @param options.view             Window instance in which to perform viewport matching.
+ * @return Object with `isBlockCurrentlyHidden` and `currentViewport` properties.
+ */
+export default function useBlockVisibility( {
+	blockVisibility,
+	deviceType = 'desktop',
+	viewportSettings,
+	view = window,
+}: UseBlockVisibilityOptions = {} ): {
+	isBlockCurrentlyHidden: boolean;
+	currentViewport: BlockVisibilityViewport;
+} {
+	const viewportBreakpoints = getViewportBreakpoints( viewportSettings );
+	const mobileMediaQuery = viewportBreakpoints.mobile
+		? `(width <= ${ viewportBreakpoints.mobile })`
+		: undefined;
+	const isMobileViewport = useMediaQuery( mobileMediaQuery, view );
+	let tabletMediaQuery;
+	if ( viewportBreakpoints.tablet ) {
+		tabletMediaQuery = viewportBreakpoints.mobile
+			? `(${ viewportBreakpoints.mobile } < width <= ${ viewportBreakpoints.tablet })`
+			: `(width <= ${ viewportBreakpoints.tablet })`;
+	}
+	const isTabletViewport = useMediaQuery( tabletMediaQuery, view );
+
+	/*
+	 * Priority:
+	 * 1. Device type override (Mobile/Tablet) - uses device type to determine viewport
+	 * 2. Actual window size (Desktop mode) - uses viewport detection
+	 */
+	let currentViewport: BlockVisibilityViewport;
+	if ( deviceType === 'mobile' && viewportBreakpoints.mobile ) {
+		currentViewport = 'mobile';
+	} else if ( deviceType === 'tablet' && viewportBreakpoints.tablet ) {
+		currentViewport = 'tablet';
+	} else if ( isMobileViewport ) {
+		currentViewport = 'mobile';
+	} else if ( isTabletViewport && viewportBreakpoints.tablet ) {
+		currentViewport = 'tablet';
+	} else {
+		currentViewport = 'desktop';
+	}
+
+	// Determine if block is currently hidden.
+	const isBlockCurrentlyHidden =
+		blockVisibility === false ||
+		( typeof blockVisibility === 'object' &&
+			blockVisibility?.viewport?.[ currentViewport ] === false );
+
+	return { isBlockCurrentlyHidden, currentViewport };
+}

package/src/components/block-visibility/utils.js

@@ -1,12 +1,25 @@
-/**
- * WordPress dependencies
- */
+import { privateApis as globalStylesEnginePrivateApis } from '@wordpress/global-styles-engine';
 import { __, sprintf } from '@wordpress/i18n';
-
-/**
- * Internal dependencies
- */
-import { BLOCK_VISIBILITY_VIEWPORT_ENTRIES } from './constants';
+import {
+	BLOCK_VISIBILITY_VIEWPORT_ENTRIES,
+	BLOCK_VISIBILITY_VIEWPORTS,
+} from './constants';
+import { unlock } from '../../lock-unlock';
+
+const { getViewportBreakpoints } = unlock( globalStylesEnginePrivateApis );
+
+export function getBlockVisibilityViewportEntries( viewportSettings ) {
+	const breakpoints = getViewportBreakpoints( viewportSettings );
+
+	// Desktop has no breakpoint, so only filter mobile/tablet by configured viewport support.
+	return BLOCK_VISIBILITY_VIEWPORT_ENTRIES.filter(
+		( [ viewport ] ) =>
+			( viewport !== BLOCK_VISIBILITY_VIEWPORTS.tablet.key ||
+				breakpoints.tablet !== undefined ) &&
+			( viewport !== BLOCK_VISIBILITY_VIEWPORTS.mobile.key ||
+				breakpoints.mobile !== undefined )
+	);
+}
 
 /**
  * Checks if a block is hidden for a specific viewport.
@@ -110,10 +123,11 @@ export function getHideEverywhereCheckboxState( blocks ) {
 /**
  * Get a human-readable label describing which viewports a block is hidden on.
  *
- * @param {boolean|Object} blockVisibility The block's visibility metadata.
+ * @param {boolean|Object} blockVisibility  The block's visibility metadata.
+ * @param {Object}         viewportSettings Viewport breakpoint settings.
  * @return {string|null} A descriptive label, or null if the block is not hidden.
  */
-export function getBlockVisibilityLabel( blockVisibility ) {
+export function getBlockVisibilityLabel( blockVisibility, viewportSettings ) {
 	// Not hidden at all
 	if ( ! blockVisibility && blockVisibility !== false ) {
 		return null;
@@ -126,9 +140,13 @@ export function getBlockVisibilityLabel( blockVisibility ) {
 
 	if ( blockVisibility?.viewport ) {
 		// Hidden on specific viewports - list them
-		const hiddenViewports = BLOCK_VISIBILITY_VIEWPORT_ENTRIES.filter(
-			( [ key ] ) => blockVisibility.viewport?.[ key ] === false
-		).map( ( [ , viewport ] ) => viewport.label );
+		const hiddenViewports = getBlockVisibilityViewportEntries(
+			viewportSettings
+		)
+			.filter(
+				( [ key ] ) => blockVisibility.viewport?.[ key ] === false
+			)
+			.map( ( [ , viewport ] ) => viewport.label );
 
 		if ( hiddenViewports.length > 0 ) {
 			return sprintf(

package/src/components/block-visibility/viewport-menu-item.js

@@ -1,18 +1,13 @@
-/**
- * WordPress dependencies
- */
 import { __ } from '@wordpress/i18n';
 import { MenuItem } from '@wordpress/components';
 import { useSelect, useDispatch } from '@wordpress/data';
 import { store as keyboardShortcutsStore } from '@wordpress/keyboard-shortcuts';
-
-/**
- * Internal dependencies
- */
 import { store as blockEditorStore } from '../../store';
 import { unlock } from '../../lock-unlock';
+import { useSettings } from '../use-settings';
 
 export default function BlockVisibilityViewportMenuItem( { clientIds } ) {
+	const [ blockVisibility ] = useSettings( 'blockVisibility.allowEditing' );
 	const { areBlocksHiddenAnywhere, shortcut } = useSelect(
 		( select ) => {
 			const { isBlockHiddenAnywhere } = unlock(
@@ -31,7 +26,14 @@ export default function BlockVisibilityViewportMenuItem( { clientIds } ) {
 		},
 		[ clientIds ]
 	);
-	const { showViewportModal } = unlock( useDispatch( blockEditorStore ) );
+	const dispatch = useDispatch( blockEditorStore );
+
+	if ( blockVisibility === false ) {
+		return null;
+	}
+
+	const { showViewportModal } = unlock( dispatch );
+
 	return (
 		<MenuItem
 			onClick={ () => showViewportModal( clientIds ) }

package/src/components/block-visibility/viewport-toolbar.js

@@ -1,21 +1,16 @@
-/**
- * WordPress dependencies
- */
 import { __ } from '@wordpress/i18n';
 import { ToolbarButton, ToolbarGroup } from '@wordpress/components';
 import { useRef, useEffect } from '@wordpress/element';
 import { seen, unseen } from '@wordpress/icons';
 import { hasBlockSupport } from '@wordpress/blocks';
 import { useSelect, useDispatch } from '@wordpress/data';
-
-/**
- * Internal dependencies
- */
 import { store as blockEditorStore } from '../../store';
 import { unlock } from '../../lock-unlock';
+import { useSettings } from '../use-settings';
 
 export default function BlockVisibilityViewportToolbar( { clientIds } ) {
 	const hasBlockVisibilityButtonShownRef = useRef( false );
+	const [ blockVisibility ] = useSettings( 'blockVisibility.allowEditing' );
 	const { canToggleBlockVisibility, areBlocksHiddenAnywhere } = useSelect(
 		( select ) => {
 			const { getBlocksByClientId, getBlockName, isBlockHiddenAnywhere } =
@@ -52,6 +47,10 @@ export default function BlockVisibilityViewportToolbar( { clientIds } ) {
 		}
 	}, [ areBlocksHiddenAnywhere ] );
 
+	if ( blockVisibility === false ) {
+		return null;
+	}
+
 	if (
 		! areBlocksHiddenAnywhere &&
 		! hasBlockVisibilityButtonShownRef.current

package/src/components/block-visibility/viewport-visibility-info.js

@@ -1,6 +1,3 @@
-/**
- * WordPress dependencies
- */
 import {
 	Icon as WCIcon,
 	__experimentalText as WCText,
@@ -10,10 +7,6 @@ import {
 import { useSelect } from '@wordpress/data';
 import { __, sprintf } from '@wordpress/i18n';
 import { unseen } from '@wordpress/icons';
-
-/**
- * Internal dependencies
- */
 import { unlock } from '../../lock-unlock';
 import { store as blockEditorStore } from '../../store';
 import useBlockVisibility from './use-block-visibility';
@@ -32,6 +25,7 @@ export default function ViewportVisibilityInfo( { clientId } ) {
 	const {
 		currentBlockVisibility,
 		selectedDeviceType,
+		viewportSettings,
 		hasParentHiddenEverywhere,
 	} = useSelect(
 		( select ) => {
@@ -43,13 +37,15 @@ export default function ViewportVisibilityInfo( { clientId } ) {
 				isBlockParentHiddenEverywhere,
 				getSettings,
 			} = unlock( select( blockEditorStore ) );
+			const settings = getSettings();
 
 			return {
 				currentBlockVisibility:
 					getBlockAttributes( clientId )?.metadata?.blockVisibility,
 				selectedDeviceType:
-					getSettings()?.[ deviceTypeKey ]?.toLowerCase() ||
+					settings?.[ deviceTypeKey ]?.toLowerCase() ||
 					BLOCK_VISIBILITY_VIEWPORTS.desktop.key,
+				viewportSettings: settings?.__experimentalFeatures?.viewport,
 				hasParentHiddenEverywhere:
 					isBlockParentHiddenEverywhere( clientId ),
 			};
@@ -66,6 +62,7 @@ export default function ViewportVisibilityInfo( { clientId } ) {
 	const { isBlockCurrentlyHidden, currentViewport } = useBlockVisibility( {
 		blockVisibility: currentBlockVisibility,
 		deviceType: selectedDeviceType,
+		viewportSettings,
 		view: canvasView,
 	} );
 

package/src/components/border-radius-control/README.md

@@ -5,9 +5,6 @@
 ## Usage
 
 ```jsx
-/**
- * WordPress dependencies
- */
 import { __experimentalBorderRadiusControl as BorderRadiusControl } from '@wordpress/block-editor';
 import { useState } from '@wordpress/element';
 

package/src/components/border-radius-control/constants.js

@@ -1,6 +1,3 @@
-/**
- * WordPress dependencies
- */
 import { __ } from '@wordpress/i18n';
 import {
 	cornerAll,

package/src/components/border-radius-control/index.js

@@ -1,6 +1,3 @@
-/**
- * WordPress dependencies
- */
 import {
 	BaseControl,
 	__experimentalParseQuantityAndUnitFromRawValue as parseQuantityAndUnitFromRawValue,
@@ -10,10 +7,6 @@ import {
 } from '@wordpress/components';
 import { useState, useMemo } from '@wordpress/element';
 import { __ } from '@wordpress/i18n';
-
-/**
- * Internal dependencies
- */
 import LinkedButton from './linked-button';
 import { useSettings } from '../use-settings';
 import { hasDefinedValues, hasMixedValues, getAllValue } from './utils';

package/src/components/border-radius-control/linked-button.js

@@ -1,6 +1,3 @@
-/**
- * WordPress dependencies
- */
 import { Button } from '@wordpress/components';
 import { link, linkOff } from '@wordpress/icons';
 import { __ } from '@wordpress/i18n';

package/src/components/border-radius-control/stories/index.story.jsx

@@ -1,11 +1,4 @@
-/**
- * WordPress dependencies
- */
 import { useState } from '@wordpress/element';
-
-/**
- * Internal dependencies
- */
 import BorderRadiusControl from '../';
 
 const meta = {