Fix a problem caused by the merge conflict

Replace the correct tools panel item. Add textOrientation to the typography styles in the theme.json reference
WordPress · Apr 22, 2024 · 6e9e6a6 · 6e9e6a6
1 parent 71b0b8f
commit 6e9e6a6
Show file tree

Hide file tree

Showing 2 changed files with 15 additions and 17 deletions.
diff --git a/docs/reference-guides/theme-json-reference/theme-json-living.md b/docs/reference-guides/theme-json-reference/theme-json-living.md
@@ -274,6 +274,7 @@ Typography styles.
 | textColumns | string |  |
 | textDecoration | string, object |  |
 | writingMode | string, object |  |
+| textOrientation | string, object |  |
 | textTransform | string, object |  |
 
 ---

diff --git a/packages/block-editor/src/components/global-styles/typography-panel.js b/packages/block-editor/src/components/global-styles/typography-panel.js
@@ -530,23 +530,6 @@ export default function TypographyPanel( {
 					/>
 				</ToolsPanelItem>
 			) }
-			{ hasWritingModeControl && (
-				<ToolsPanelItem
-					className="single-column"
-					label={ __( 'Orientation' ) }
-					hasValue={ hasWritingMode }
-					onDeselect={ resetWritingMode }
-					isShownByDefault={ defaultControls.writingMode }
-					panelId={ panelId }
-				>
-					<WritingModeControl
-						value={ writingMode }
-						onChange={ setWritingMode }
-						size="__unstable-large"
-						__nextHasNoMarginBottom
-					/>
-				</ToolsPanelItem>
-			) }
 			{ hasTextTransformControl && (
 				<ToolsPanelItem
 					label={ __( 'Letter case' ) }
@@ -565,6 +548,20 @@ export default function TypographyPanel( {
 					/>
 				</ToolsPanelItem>
 			) }
+			{ hasWritingModeControl && (
+				<ToolsPanelItem
+					label={ __( 'Text orientation' ) }
+					hasValue={ hasWritingMode }
+					onDeselect={ resetWritingMode }
+					isShownByDefault={ defaultControls.writingMode }
+					panelId={ panelId }
+				>
+					<WritingModeControl
+						value={ getValuefromWritingModeAndTextOrientation() }
+						onChange={ setWritingModeAndTextOrientation }
+					/>
+				</ToolsPanelItem>
+			) }
 		</Wrapper>
 	);
 }