Improve hint text

t-hamano · Oct 20, 2024 · 15f6256 · 15f6256
1 parent b82f350
commit 15f6256
Show file tree

Hide file tree

Showing 2 changed files with 20 additions and 8 deletions.
diff --git a/src/elements/table-placeholder.tsx b/src/elements/table-placeholder.tsx
@@ -11,6 +11,7 @@ import { __ } from '@wordpress/i18n';
 import { useState, createInterpolateElement } from '@wordpress/element';
 import { BlockIcon } from '@wordpress/block-editor';
 import { Button, Placeholder, TextControl, ToggleControl } from '@wordpress/components';
+import { isAppleOS } from '@wordpress/keycodes';
 
 /**
  * Internal dependencies
@@ -97,10 +98,15 @@ export default function TablePlaceholder( { setAttributes }: Props ) {
 		>
 			<legend className="components-placeholder__instructions">
 				{ createInterpolateElement(
-					__(
-						'Hint: Hold <code>Ctrl</code> key to select multiple cells. Hold <code>Shift</code> key to select the range.',
-						'flexible-table-block'
-					),
+					isAppleOS()
+						? __(
+								'Hint: Hold <code>Command</code> key to select multiple cells. Hold <code>Shift</code> key to select the range.',
+								'flexible-table-block'
+						  )
+						: __(
+								'Hint: Hold <code>Ctrl</code> key to select multiple cells. Hold <code>Shift</code> key to select the range.',
+								'flexible-table-block'
+						  ),
 					{ code: <code /> }
 				) }
 			</legend>

diff --git a/src/settings/global-settings/help-modal.tsx b/src/settings/global-settings/help-modal.tsx
@@ -15,6 +15,7 @@ import {
 	__experimentalText as Text,
 	__experimentalHeading as Heading,
 } from '@wordpress/components';
+import { isAppleOS } from '@wordpress/keycodes';
 
 type Props = {
 	setIsHelpModalOpen: Dispatch< SetStateAction< boolean > >;
@@ -43,10 +44,15 @@ export default function HelpModal( { setIsHelpModalOpen }: Props ) {
 					<Heading level={ 5 }>{ __( 'Select multiple cells', 'flexible-table-block' ) }</Heading>
 					<Text as="p">
 						{ createInterpolateElement(
-							__(
-								'Hold <code>Ctrl</code> key to select multiple cells or hold <code>Shift</code> key to select the range. Selecting multiple cells is used to merge cells or to change styles of multiple cells.',
-								'flexible-table-block'
-							),
+							isAppleOS()
+								? __(
+										'Hold <code>Command</code> key to select multiple cells. Hold <code>Shift</code> key to select the range. Selecting multiple cells is used to merge cells or to change styles of multiple cells.',
+										'flexible-table-block'
+								  )
+								: __(
+										'Hold <code>Ctrl</code> key to select multiple cells. Hold <code>Shift</code> key to select the range. Selecting multiple cells is used to merge cells or to change styles of multiple cells.',
+										'flexible-table-block'
+								  ),
 							{ code: <code /> }
 						) }
 					</Text>