Icons: Add align-item related icons (WordPress#66242)

* Icons: Add align-item related icons

* Use `justify` prefix

Co-authored-by: t-hamano <[email protected]>
Co-authored-by: jameskoster <[email protected]>

Author: t-hamano

packages/block-editor/src/components/block-vertical-alignment-control/icons.js

@@ -3,37 +3,33 @@
  */
 import { _x } from '@wordpress/i18n';
 import { ToolbarGroup, ToolbarDropdownMenu } from '@wordpress/components';
-
-/**
- * Internal dependencies
- */
 import {
-	alignTop,
-	alignCenter,
-	alignBottom,
-	alignStretch,
-	spaceBetween,
-} from './icons';
+	justifyTop,
+	justifyCenterVertical,
+	justifyBottom,
+	justifyStretchVertical,
+	justifySpaceBetweenVertical,
+} from '@wordpress/icons';
 
 const BLOCK_ALIGNMENTS_CONTROLS = {
 	top: {
-		icon: alignTop,
+		icon: justifyTop,
 		title: _x( 'Align top', 'Block vertical alignment setting' ),
 	},
 	center: {
-		icon: alignCenter,
+		icon: justifyCenterVertical,
 		title: _x( 'Align middle', 'Block vertical alignment setting' ),
 	},
 	bottom: {
-		icon: alignBottom,
+		icon: justifyBottom,
 		title: _x( 'Align bottom', 'Block vertical alignment setting' ),
 	},
 	stretch: {
-		icon: alignStretch,
+		icon: justifyStretchVertical,
 		title: _x( 'Stretch to fill', 'Block vertical alignment setting' ),
 	},
 	'space-between': {
-		icon: spaceBetween,
+		icon: justifySpaceBetweenVertical,
 		title: _x( 'Space between', 'Block vertical alignment setting' ),
 	},
 };

packages/block-editor/src/components/block-vertical-alignment-control/ui.js

@@ -130,11 +130,16 @@ export { default as image } from './library/image';
 export { default as info } from './library/info';
 export { default as insertAfter } from './library/insert-after';
 export { default as insertBefore } from './library/insert-before';
+export { default as justifyBottom } from './library/justify-bottom';
 export { default as justifyLeft } from './library/justify-left';
 export { default as justifyCenter } from './library/justify-center';
+export { default as justifyCenterVertical } from './library/justify-center-vertical';
 export { default as justifyRight } from './library/justify-right';
 export { default as justifySpaceBetween } from './library/justify-space-between';
+export { default as justifySpaceBetweenVertical } from './library/justify-space-between-vertical';
 export { default as justifyStretch } from './library/justify-stretch';
+export { default as justifyStretchVertical } from './library/justify-stretch-vertical';
+export { default as justifyTop } from './library/justify-top';
 export { default as key } from './library/key';
 export { default as keyboard } from './library/keyboard';
 export { default as keyboardClose } from './library/keyboard-close';

packages/icons/src/index.js

@@ -0,0 +1,12 @@
+/**
+ * WordPress dependencies
+ */
+import { SVG, Path } from '@wordpress/primitives';
+
+const justifyBottom = (
+	<SVG xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24">
+		<Path d="M15 4H9v11h6V4zM4 18.5V20h16v-1.5H4z" />
+	</SVG>
+);
+
+export default justifyBottom;

packages/icons/src/library/justify-bottom.js

@@ -0,0 +1,12 @@
+/**
+ * WordPress dependencies
+ */
+import { SVG, Path } from '@wordpress/primitives';
+
+const justifyCenterVertical = (
+	<SVG xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24">
+		<Path d="M20 11h-5V4H9v7H4v1.5h5V20h6v-7.5h5z" />
+	</SVG>
+);
+
+export default justifyCenterVertical;

packages/icons/src/library/justify-center-vertical.js

@@ -0,0 +1,12 @@
+/**
+ * WordPress dependencies
+ */
+import { SVG, Path } from '@wordpress/primitives';
+
+const justifySpaceBetweenVertical = (
+	<SVG xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24">
+		<Path d="M7 4H17V8L7 8V4ZM7 16L17 16V20L7 20V16ZM20 11.25H4V12.75H20V11.25Z" />
+	</SVG>
+);
+
+export default justifySpaceBetweenVertical;

packages/icons/src/library/justify-space-between-vertical.js

@@ -0,0 +1,12 @@
+/**
+ * WordPress dependencies
+ */
+import { SVG, Path } from '@wordpress/primitives';
+
+const justifyStretchVertical = (
+	<SVG xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24">
+		<Path d="M4 4L20 4L20 5.5L4 5.5L4 4ZM10 7L14 7L14 17L10 17L10 7ZM20 18.5L4 18.5L4 20L20 20L20 18.5Z" />
+	</SVG>
+);
+
+export default justifyStretchVertical;

packages/icons/src/library/justify-stretch-vertical.js

@@ -0,0 +1,12 @@
+/**
+ * WordPress dependencies
+ */
+import { SVG, Path } from '@wordpress/primitives';
+
+const justifyTop = (
+	<SVG xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24">
+		<Path d="M9 20h6V9H9v11zM4 4v1.5h16V4H4z" />
+	</SVG>
+);
+
+export default justifyTop;