@wordpress/edit-site 6.44.0 → 6.45.0

package/src/components/sidebar-global-styles/index.js

@@ -31,7 +31,7 @@ const GlobalStylesPageActions = ( {
 	const history = useHistory();
 
 	return (
-		<HStack>
+		<HStack className="edit-site-styles__header-actions">
 			<Button
 				isPressed={ isStyleBookOpened }
 				icon={ seen }
@@ -103,6 +103,7 @@ export default function SidebarGlobalStyles() {
 			}
 			className="edit-site-styles"
 			title={ __( 'Styles' ) }
+			headingLevel={ 2 }
 		>
 			<GlobalStylesUIWrapper
 				path={ section }

package/src/components/sidebar-global-styles/style.scss

@@ -29,3 +29,22 @@
 	}
 }
 
+// Show button text labels when preference is enabled.
+.show-icon-labels {
+	.edit-site-styles__header-actions {
+		.components-button.has-icon {
+			width: auto;
+			padding: 0 var(--wpds-dimension-padding-xs);
+
+			// Hide the button icons when labels are set to display...
+			svg {
+				display: none;
+			}
+			// ... and display labels.
+			&::after {
+				content: attr(aria-label);
+				font-size: var(--wpds-typography-font-size-sm);
+			}
+		}
+	}
+}

package/src/components/sidebar-identity/index.js

@@ -74,7 +74,7 @@ export default function SidebarIdentity() {
 	};
 
 	return (
-		<Page title={ __( 'Identity' ) } hasPadding>
+		<Page title={ __( 'Identity' ) } headingLevel={ 2 } hasPadding>
 			<DataForm
 				data={ data }
 				fields={ fields }

package/src/components/site-hub/index.js

@@ -7,11 +7,7 @@ import clsx from 'clsx';
  * WordPress dependencies
  */
 import { useSelect, useDispatch } from '@wordpress/data';
-import {
-	Button,
-	__experimentalHStack as HStack,
-	VisuallyHidden,
-} from '@wordpress/components';
+import { Button, __experimentalHStack as HStack } from '@wordpress/components';
 import { __ } from '@wordpress/i18n';
 import { store as coreStore } from '@wordpress/core-data';
 import { decodeEntities } from '@wordpress/html-entities';
@@ -19,6 +15,7 @@ import { memo, forwardRef, useContext } from '@wordpress/element';
 import { search } from '@wordpress/icons';
 import { store as commandsStore } from '@wordpress/commands';
 import { displayShortcut } from '@wordpress/keycodes';
+import { VisuallyHidden } from '@wordpress/ui';
 import { filterURLForDisplay } from '@wordpress/url';
 import { privateApis as routerPrivateApis } from '@wordpress/router';
 
@@ -84,7 +81,7 @@ const SiteHub = memo(
 								target="_blank"
 							>
 								{ decodeEntities( siteTitle ) }
-								<VisuallyHidden as="span">
+								<VisuallyHidden render={ <span /> }>
 									{
 										/* translators: accessibility text */
 										__( '(opens in a new tab)' )

package/src/style.scss

@@ -1,7 +1,6 @@
 @use "@wordpress/base-styles/colors" as *;
 @use "@wordpress/base-styles/mixins" as *;
 @use "@wordpress/base-styles/default-custom-properties";
-@use "@wordpress/admin-ui/build-style/style.css" as admin-ui;
 @use "@wordpress/dataviews/build-style/style.css" as dataviews;
 @use "@wordpress/fields/build-style/style.css" as fields;
 @use "@wordpress/global-styles-ui/build-style/style.css" as global-styles-ui;