@wordpress/block-editor 15.4.1-next.f56bd8138.0 → 15.5.1-next.47f435fc9.0

package/src/components/tool-selector/index.js

@@ -1,107 +0,0 @@
-/**
- * WordPress dependencies
- */
-import {
-	Dropdown,
-	Button,
-	MenuItemsChoice,
-	SVG,
-	Path,
-	NavigableMenu,
-} from '@wordpress/components';
-import { __ } from '@wordpress/i18n';
-import { useSelect, useDispatch } from '@wordpress/data';
-import { forwardRef } from '@wordpress/element';
-import { Icon, edit as editIcon } from '@wordpress/icons';
-
-/**
- * Internal dependencies
- */
-import { store as blockEditorStore } from '../../store';
-
-const selectIcon = (
-	<SVG
-		xmlns="http://www.w3.org/2000/svg"
-		width="24"
-		height="24"
-		viewBox="0 0 24 24"
-	>
-		<Path d="M9.4 20.5L5.2 3.8l14.6 9-2 .3c-.2 0-.4.1-.7.1-.9.2-1.6.3-2.2.5-.8.3-1.4.5-1.8.8-.4.3-.8.8-1.3 1.5-.4.5-.8 1.2-1.2 2l-.3.6-.9 1.9zM7.6 7.1l2.4 9.3c.2-.4.5-.8.7-1.1.6-.8 1.1-1.4 1.6-1.8.5-.4 1.3-.8 2.2-1.1l1.2-.3-8.1-5z" />
-	</SVG>
-);
-
-function ToolSelector( props, ref ) {
-	const mode = useSelect(
-		( select ) => select( blockEditorStore ).__unstableGetEditorMode(),
-		[]
-	);
-	const { __unstableSetEditorMode } = useDispatch( blockEditorStore );
-
-	return (
-		<Dropdown
-			renderToggle={ ( { isOpen, onToggle } ) => (
-				<Button
-					size="compact"
-					{ ...props }
-					ref={ ref }
-					icon={ mode === 'navigation' ? editIcon : selectIcon }
-					aria-expanded={ isOpen }
-					aria-haspopup="true"
-					onClick={ onToggle }
-					/* translators: button label text should, if possible, be under 16 characters. */
-					label={ __( 'Tools' ) }
-				/>
-			) }
-			popoverProps={ { placement: 'bottom-start' } }
-			renderContent={ () => (
-				<>
-					<NavigableMenu
-						className="block-editor-tool-selector__menu"
-						role="menu"
-						aria-label={ __( 'Tools' ) }
-					>
-						<MenuItemsChoice
-							value={
-								mode === 'navigation' ? 'navigation' : 'edit'
-							}
-							onSelect={ ( newMode ) => {
-								__unstableSetEditorMode( newMode );
-							} }
-							choices={ [
-								{
-									value: 'navigation',
-									label: (
-										<>
-											<Icon icon={ editIcon } />
-											{ __( 'Write' ) }
-										</>
-									),
-									info: __( 'Focus on content.' ),
-									'aria-label': __( 'Write' ),
-								},
-								{
-									value: 'edit',
-									label: (
-										<>
-											{ selectIcon }
-											{ __( 'Design' ) }
-										</>
-									),
-									info: __( 'Edit layout and styles.' ),
-									'aria-label': __( 'Design' ),
-								},
-							] }
-						/>
-					</NavigableMenu>
-					<div className="block-editor-tool-selector__help">
-						{ __(
-							'Tools provide different sets of interactions for blocks. Choose between simplified content tools (Write) and advanced visual editing tools (Design).'
-						) }
-					</div>
-				</>
-			) }
-		/>
-	);
-}
-
-export default forwardRef( ToolSelector );

package/src/components/tool-selector/style.scss

@@ -1,15 +0,0 @@
-.block-editor-tool-selector__help {
-	margin-top: $grid-unit-10;
-	margin-left: -$grid-unit-10;
-	margin-right: -$grid-unit-10;
-	margin-bottom: -$grid-unit-10;
-	padding: $grid-unit-20;
-	border-top: $border-width solid $gray-300;
-	color: $gray-700;
-	min-width: 280px;
-}
-
-.block-editor-tool-selector__menu .components-menu-item__info {
-	margin-left: $grid-unit-30 + $grid-unit-15; // icon size + margin
-	text-align: left;
-}