[not verified] Story block: remove wp-components frontend dep

projects/plugins/jetpack/changelog/update-remove-wp-components-dep-from-story-frontend

@@ -0,0 +1,4 @@
+Significance: patch
+Type: enhancement
+
+Story block: remove dependency on wp-components from the frontend code

projects/plugins/jetpack/extensions/blocks/story/icon.js

@@ -1,4 +1,4 @@
-import { Path, G } from '@wordpress/components';
+import { Path, G } from '@wordpress/primitives';
 import renderMaterialIcon from '../../shared/render-material-icon';
 
 const icon = renderMaterialIcon(

projects/plugins/jetpack/extensions/blocks/story/player/components/background.js

@@ -1,4 +1,4 @@
-import { SVG } from '@wordpress/components';
+import { SVG } from '@wordpress/primitives';
 
 export default function Background( { currentMedia } ) {
 	const url = currentMedia && currentMedia.type === 'image' ? currentMedia.url : null;

projects/plugins/jetpack/extensions/blocks/story/player/components/bullet.js

@@ -1,4 +1,3 @@
-import { Button } from '@wordpress/components';
 import { __, sprintf } from '@wordpress/i18n';
 import classNames from 'classnames';
 
@@ -19,7 +18,7 @@ export default function Bullet( { isEllipsis, disabled, index, isSelected, progr
 			  );
 	}
 	return (
-		<Button
+		<button
 			role={ bulletDisabled ? 'presentation' : 'tab' }
 			key={ index }
 			className={ classNames( 'wp-story-pagination-bullet', {
@@ -36,6 +35,6 @@ export default function Bullet( { isEllipsis, disabled, index, isSelected, progr
 					style={ { width: `${ progress }%` } }
 				></div>
 			</div>
-		</Button>
+		</button>
 	);
 }

projects/plugins/jetpack/extensions/blocks/story/player/components/icons.js

@@ -1,4 +1,4 @@
-import { Path } from '@wordpress/components';
+import { Path } from '@wordpress/primitives';
 import renderMaterialIcon from '../../../../shared/render-material-icon';
 
 const MaterialIcon = ( { children, size } ) => renderMaterialIcon( children, size, size );

projects/plugins/jetpack/extensions/shared/render-material-icon.js

@@ -1,4 +1,4 @@
-import { Path, SVG } from '@wordpress/components';
+import { Path, SVG } from '@wordpress/primitives';
 
 const renderMaterialIcon = ( svg, width = 24, height = 24, viewbox = '0 0 24 24' ) => (
 	<SVG xmlns="http://www.w3.org/2000/svg" width={ width } height={ height } viewBox={ viewbox }>

projects/plugins/jetpack/tools/check-block-assets.php

@@ -75,11 +75,11 @@
 		'lodash',
 		'react',
 		'react-dom',
-		'wp-components',
 		'wp-compose',
 		'wp-data',
 		'wp-element',
 		'wp-keycodes',
+		'wp-primitives',
 	),
 );